JavaFX [FXML] 调整 window 大小时,将组件保持在 window 的中心

JavaFX [FXML] Keep components in the center of the window when the window is resized

我正在使用 javaFX 和 FXML 文件创建 UI。这是 fxml 文件。

<VBox alignment="CENTER" prefHeight="720.0" prefWidth="1080" spacing="20.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="fi.tuni.prog3.sisu.PrimaryController">
   <children>
      <TabPane fx:id="tabPane" prefHeight="650.0" prefWidth="828.0" tabClosingPolicy="UNAVAILABLE">
        <tabs>
          <Tab text="Aloitus">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="202.0" prefWidth="289.0">
                     <children>
                        <TextField id="nimi" fx:id="nimi" layoutX="475.0" layoutY="198.0" />
                        <TextField id="opnro" fx:id="opnro" layoutX="475.0" layoutY="236.0" /> 
                        <Label layoutX="424.0" layoutY="203.0" text="Nimi:" />
                        <Label layoutX="346.0" layoutY="241.0" text="Opiskelijanumero:" />
                        <ComboBox id="box" fx:id="box" layoutX="400.0" layoutY="278.0" minHeight="-Infinity" minWidth="-Infinity" prefHeight="27.0" prefWidth="241.0" />
                        <Button fx:id="EIKU" layoutX="491.0" layoutY="315.0" mnemonicParsing="false" onAction="#EIKUPressed" prefHeight="27.0" prefWidth="60.0" text="EIKU" />
                        <Button layoutX="491.0" layoutY="352.0" mnemonicParsing="false" onAction="#buttonPressed" text="Valmis" />
                     </children>
                     <padding>
                        <Insets bottom="1.0" left="1.0" right="1.0" top="1.0" />
                     </padding>
                  </AnchorPane>
            </content>
          </Tab>
          <Tab id="tab2" fx:id="tab2" text="Koulutus">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0">
                     <children>
                        <SplitPane dividerPositions="0.5" layoutX="-1.0" layoutY="-1.0" prefHeight="573.0" prefWidth="828.0">
                          <items>
                            <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
                                 <children>
                                    <TreeView id="puu" fx:id="puu" layoutX="6.0" prefHeight="571.0" prefWidth="404.0" />
                                 </children>
                              </AnchorPane>
                            <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="486.0" prefWidth="456.0" />
                          </items>
                        </SplitPane>
                     </children></AnchorPane>
            </content>
          </Tab>
        </tabs>
      </TabPane>
   </children>

   <padding>
      <Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
   </padding>
</VBox>

我的问题是,在调整 window 大小时,字段和按钮停留在同一个位置。因此,如果我将 window 最小化很多,它们最终会消失,如果我扩展 window,它们将与 window 的左侧和顶部保持与最初相同的距离。

与所有 4 个面相比,我希望它们保持在同一个位置,这样它们就会保持在 window 的中心。我该如何实施?我一直在寻找答案,老实说,我为找不到答案而感到有点愚蠢。

感谢@jewelsea。使用带边距的 stackPane 完美地解决了我的问题。我使用 SceneBuilder 一个一个添加内容,并编辑每个组件的边距,使其占据所需的位置。