Question

我有tabPane有多个标签，其中一个tabPane我有scrollPane。在scrollPane中，我有许多UI控件As shown on this image，当我点击一个按钮时，我想要动态添加它们。

这个image here显示了我拥有的UI设置。 UI控件位于Vbox内的Hbox中。

当用户点击添加按钮时，我想添加包含所有控件的另一行，如image所示。

我已经查看了这些帖子，但仍然无法对我的代码实现相同的效果。

JavaFX continuous form dynamically add new row with content in gridpane，
Dynamically add elements to a fixed-size GridPane in JavaFX，
How to maintain GridPane's fixed-size after adding elemnts dynamically

当我按照上面引用的第一个问题上的另一个堆栈溢出成员建议的方法时，使用listView代码工作。然而，他的建议以编程方式编码UI控件，当我尝试更改和使用我在场景构建器中创建的UI控件时，它不起作用。此外，当我把控件放在tabPane中时，我的代码不起作用。这意味着当我单击添加按钮时，它不会按预期添加UI控件。

我的问题是，当单击该选项卡中的按钮时，如何在tabPane内的选项卡中动态添加UI控件。

这是我的代码：

public class DynamicalyAddControlsController {

@FXML
private VBox vbox;

@FXML
private HBox hbox;

@FXML
private StackPane stack1;

@FXML
private Label taskid;

@FXML
private TextField taskname;

@FXML
private ComboBox<String> combobox;

@FXML
private TextArea textarea;

@FXML
private Button save;

private ObservableList<Car> cars = FXCollections.observableArrayList();

public void initialize(URL url, ResourceBundle rb) {
cars.addAll(new Car(CAR_TYPE.CAR1), new Car(CAR_TYPE.CAR2), new Car(CAR_TYPE.CAR3));

ListView<Car> carsListView = new ListView<>();
carsListView.setCellFactory(c -> new CarListCell());
carsListView.setItems(cars);


stack1.getChildren().add(carsListView);

} 

private class CarListCell extends ListCell<Car> {


private ChoiceBox<CAR_TYPE> choiceBox = new ChoiceBox<>();


public CarListCell(){ 

choiceBox.setItems(FXCollections.observableArrayList
(CAR_TYPE.values()));  

    hbox.getChildren().addAll(taskid,taskname,combobox,choiceBox);
    vbox.getChildren().addAll(hbox,textarea);
    setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
    setGraphic(vbox);
}

@Override
protected void updateItem(Car item, boolean empty) {
    super.updateItem(item, empty);
    if (item == null || empty) {
        setText(null);
        setGraphic(null);
    } else {
        setGraphic(vbox);
        choiceBox.setValue(item.getType());
        save.setOnAction(e -> {
            Car newCar = new Car(choiceBox.getValue());
            cars.add(newCar);
        });

    }
}

}

private enum CAR_TYPE {
   CAR1, CAR2, CAR3;
}

private class Car {

private CAR_TYPE type;

public Car(CAR_TYPE type) {
    this.type = type;
}

public CAR_TYPE getType() {
    return type;
}

public void setType(CAR_TYPE type) {
    this.type = type;
}
}
public void initialize(URL url, ResourceBundle rb) {

} 

}

JavaApplication主类

    @Override
public void start(Stage primaryStage) throws Exception{

    Parent viewB = FXMLLoader.load(getClass().getResource("DynamicalyAddControls.fxml"));
    Stage stageB = new Stage();
    stageB.setScene(new Scene(viewB));
    stageB.show();

}


public static void main(String[] args) {
    launch(args);
}

单击按钮时动态添加UI控件

0 个答案: