Java FX如何跨行？

Question

所以我对使用Java FX感到很陌生，尽管之前我曾经使用过Android Studio，所以有一些相似之处。我在制作元素时遇到了一些问题，但仍然存在多个列。我已经看到一些线程是人们在Javam中以编程方式跨越它，但是我不会在fxml文件中创建任何带有java的网格。这是我正在做的简单计算器的fxml代码：

 <GridPane fx:controller="sample.Controller"
          xmlns:fx="http://javafx.com/fxml" alignment="center" hgap="10" vgap="10"
>

    <GridPane GridPane.columnIndex="0" GridPane.rowIndex="0" >
        <TextField fx:id="display" id="displayCSS" GridPane.columnSpan="3" ></TextField>
    </GridPane>

    <GridPane GridPane.columnIndex="0" GridPane.rowIndex="1">
        <Button text="+"  GridPane.rowIndex="1" GridPane.columnIndex="0" fx:id="btnadd" onAction="#btnAdd"    />
        <Button text="-"  GridPane.rowIndex="1" GridPane.columnIndex="1" fx:id="btnSub" onAction="#btnSub" />
        <Button text="/"  GridPane.rowIndex="2" GridPane.columnIndex="0" fx:id="btnDiv" onAction="#btnDiv"  />
        <Button text="*"  GridPane.rowIndex="2" GridPane.columnIndex="1" fx:id="btnMult" onAction="#btnMulti" />
        <Button text="Del"  GridPane.rowIndex="3" GridPane.columnIndex="0" fx:id="btnDel" onAction="#btnDel" />
        <Button text="CA"  GridPane.rowIndex="3" GridPane.columnIndex="1" fx:id="btnCA" onAction="#btnCA" />
        <Button text="="  GridPane.rowIndex="4" GridPane.columnIndex="0" fx:id="btnEqual" id="equals" onAction="#btnEqual"  />
    </GridPane>

    <GridPane GridPane.columnIndex="1" GridPane.rowIndex="1">
        <Button text="9" GridPane.columnIndex="2" GridPane.rowIndex="1" onAction="#btn9" />
        <Button text="8" GridPane.columnIndex="1" GridPane.rowIndex="1" onAction="#btn8"/>
        <Button text="7" GridPane.columnIndex="0" GridPane.rowIndex="1" onAction="#btn7" />
        <Button text="6" GridPane.columnIndex="2" GridPane.rowIndex="2" onAction="#btn6" />
        <Button text="5" GridPane.columnIndex="1" GridPane.rowIndex="2" onAction="#btn5" />
        <Button text="4" GridPane.columnIndex="0" GridPane.rowIndex="2" onAction="#btn4"/>
        <Button text="3" GridPane.columnIndex="2" GridPane.rowIndex="3" onAction="#btn3"/>
        <Button text="2" GridPane.columnIndex="1" GridPane.rowIndex="3" onAction="#btn2"/>
        <Button text="1" GridPane.columnIndex="0" GridPane.rowIndex="3" onAction="#btn1"/>
        <Button text="0" GridPane.columnIndex="1" GridPane.rowIndex="4" onAction="#btn0" GridPane.columnSpan="50" />
    </GridPane>
</GridPane>

我希望=和0按钮跨越2和3列，这样它们也会变宽。

Answer 1

你可以做到

    <Button text="="  GridPane.rowIndex="4" GridPane.columnIndex="0" 
          GridPane.columnSpan="2" fx:id="btnEqual" id="equals" 
          onAction="#btnEqual" GridPane.fillWidth="true" maxWidth="Infinity" />

和

    <Button text="0" GridPane.columnIndex="0" GridPane.rowIndex="4" 
        onAction="#btn0" GridPane.columnSpan="3" GridPane.fillWidth="true" 
        maxWidth="Infinity" />