带有TextFields和Checkboxes的动态Gridpane

Question

我正在开展一个有2个标签的项目。在第一个标签的用户界面上有一个文本字段和一个按钮。在文本字段中，用户可以写任何数字直到100，当他按下按钮时，我的应用程序将转到下一个选项卡，其中有一个Gridpane，其中有三列A，B和C.

所以我想要的是用户将在第一个标签的文本字段中输入的数字，根据该数字，它应该在第二个标签的Gridpane中添加与Textfields，Checkboxes和Datepicker相同的行数。< / p>

使用SceneBuilder，可以很容易地创建固定大小的Gridpane，然后在其中添加元素并给它们fx：id，但动态它很复杂，因为我已经将fx：id赋给了每个文本字段，复选框和Datepicker，以便我可以检索它的数据，并可以发送到数据库。

我应该使用Gridpane还是有任何其他解决方案来实现目标。如果有人可以指导我需要做什么，那将是很有帮助的。

Answer 1

您不能在fxml文件中使用循环logig。但是，您可以实现一些逻辑来添加指定数量的行。 <fx:root>元素可用于为各行创建fxml文件：

main.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.text.Text?>

<GridPane fx:id="root" prefHeight="400.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml/1" fx:controller="fxml.grid.MainController">
    <children>
        <Text text="A"/>
        <Text text="B" GridPane.columnIndex="1"/>
        <Text text="C" GridPane.columnIndex="2"/>
    </children>
</GridPane>

sub.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.control.DatePicker?>

<fx:root type="javafx.scene.layout.GridPane" xmlns:fx="http://javafx.com/fxml/1" fx:controller="fxml.grid.SubController">
    <children>
        <TextField fx:id="text" GridPane.columnIndex="0" GridPane.rowIndex="$rowIndex" />
        <CheckBox fx:id="checkBox" GridPane.columnIndex="1" GridPane.rowIndex="$rowIndex" />
        <DatePicker fx:id="datePicker" GridPane.columnIndex="2" GridPane.rowIndex="$rowIndex" />
    </children>
</fx:root>

MainController

public class MainController {

    @FXML
    private GridPane root;

    private final List<SubController> subControllers = new ArrayList<>();

    public void setRowNumber(int rows) throws IOException {
        if (rows < subControllers.size()) {
            // for simplicity only allow the number of rows to grow
            throw new IllegalArgumentException();
        }
        for (int i = subControllers.size(); i < rows; i++) {
            FXMLLoader loader = new FXMLLoader(getClass().getResource("sub.fxml"));

            // add rowIndex to be used from fxml using $rowIndex
            loader.getNamespace().put("rowIndex", subControllers.size() + 1);

            loader.setRoot(root);
            loader.load();
            subControllers.add(loader.getController());
        }
    }

}

子控制器

public class SubController {
    @FXML
    private TextField text;
    @FXML
    private CheckBox checkBox;
    @FXML
    private DatePicker datePicker;

}

使用

int num = 6;
FXMLLoader loader = new FXMLLoader(getClass().getResource("main.fxml"));
Parent parent = loader.load();
loader.<MainController>getController().setRowNumber(num);

向控制器添加方法以访问单个元素应该不会太难。

请注意，TableView也值得一看。