JavaFx如何动态的添加组件，以及如何获取添加的组件中填写的值

动态添加组件

javafx布局

这里就只介绍了，我主要用到的两种。

VBox

   VBox布局将子节点堆叠在垂直列中。新添加的子节点被放置在上一个子节点的下面。默认情况下，VBox尊重子节点的首选宽度和高度。
  当父节点不可调整大小时，例如Group节点，最大垂直列的宽度基于具有最大优选宽度的节点。默认情况下，每个子节点与左上(Pos.TOP_LEFT)位置对齐。

HBox

   HBox布局类将JavaFX子节点放在水平行中。 新的子节点附加到右侧的末尾。默认情况下，HBox布局尊重子节点的首选宽度和高度。当父节点不可调整大小时，例如Group节点，HBox的行高度设置为子节点的最大首选高度。
   默认情况下，每个子节点与左上(Pos.TOP_LEFT)位置对齐。
我们可以通过编程方式改变HBox的布局约束，例如边框，填充，边距，间距和对齐。

下面是在SceneBuilder可视化工具上面的布局效果，

其中HBox部分是动态添加的部分，这一部分是利用代码实现的。

之所以这样设计的原因

1. 想让填写的模块从上到下依次排列(VBox)
2. 想让每一个模块内部按照从左到右的顺序进行添加(HBox)。

具体添加模块的代码：

当然这里面有些关于位置的设定，我是通过可视化工具，先找到差不多的位置和效果，然后根据fxml文档中节点的属性进行设置的。

    @FXML
    private VBox timebox;          //填写时间的板块

//点击添加时间
@FXML
void addtimecustom(MouseEvent event) {
    //理论上来说，下面这种方式应该也是可以的，但是不知道为什么就是出不来效果
    //AnchorPane time1 = new AnchorPane(timecustom);
    //timebox.getChildren().add(time1);

    HBox timeall = new HBox();

    TextField time = new TextField();
    time.setPrefHeight(6.0);
    time.setPrefWidth(40.0);
    time.setLayoutY(2.0);
    timeall.getChildren().add(time);

    Label time1 = new Label("  : ");
    time1.setLayoutX(53.0);
    time1.setLayoutY(-2.0);
    time1.prefHeight(28.0);
    time1.setPrefWidth(19.0);
    timeall.getChildren().add(time1);

    TextField time2 = new TextField();
    time2.setPrefHeight(6.0);
    time2.setPrefWidth(40.0);
    time2.setLayoutY(2.0);
    timeall.getChildren().add(time2);

    timebox.setSpacing(10.0);
    timebox.getChildren().add(timeall);
}

    //点击减少时间段
    @FXML
    void subtimecustom(MouseEvent event) {
        timebox.getChildren().remove(0);//这个index 0 是删除视觉上面排在第一个的。
    }

获取动态添加组件中填写的值

获取值之前，需要清楚，谁是父节点，谁是子节点。从本文的例子上面来说，VBox是HBox的父节点，HBox是TextField、Label的父节点。

清楚了这些之后就比较简单了，主要使用了getChildren()的方法，涉及到强制转换对象。

代码如下：
思路：运用了两个循环

1. 第一个循环负责遍历VBox下面所有的HBox节点
2. 第二个循环负责遍历HBox下面的TextField并且获取其中的值。

    List  getcustomtime(){
        //ObservableList timeNodes
        //这种写法没有问题，但是没有办法绕过中间的那个冒号
        //for (Node node : timebox.getChildren()) {
            //time = (HBox)node;
            //for (Node node1 : time.getChildren()){
                //TextField text =(TextField) node1;

            //}
        //}
        List<String> list = new ArrayList<String>();
        for(int i = 0; i <timebox.getChildren().size(); i++){
            time = (HBox) timebox.getChildren().get(i);
            StringBuilder str = new StringBuilder();
            for(int j = 0; j < time.getChildren().size(); j ++){
                if(j == 1){ str.append(":");}
                else {
                    TextField text = (TextField) time.getChildren().get(j);
                    str.append(text.getText());
                }
            }
            list.add(str.toString());
        }
        return list;
    }

效果：

参考资料

1. https://www.yiibai.com/javafx/javafx_vbox.html
2. https://www.yiibai.com/javafx/javafx_hbox.html