JavaFX HBox内子控件固定左上角 设置Layout X/Y无效问题

JavaFX 中HBox、VBox这类内置布局面板自带固定的排列规则，手动修改子控件的layoutX、layoutY属性不会产生任何效果：这类布局会完全接管子控件的位置计算逻辑，HBox默认会将所有子控件沿水平方向排成单行、整体靠左上角对齐，你在Scene Builder中手动拖拽子控件、修改坐标属性的操作，都会被布局自身的计算逻辑覆盖，所以所有HBox内的控件都会固定卡在左上角。
你的代码还存在布局选型错误：你试图通过给多个HBox手动设置X/Y坐标的方式拼出网格/磁贴效果，本质是把自动布局容器当成绝对定位容器用，不仅写起来麻烦，窗口缩放时还很容易出现错位。

• 选对布局容器：HBox/VBox仅适合做单方向的线性排列，不要用来搭建网格/磁贴类页面。这类场景优先使用TilePane（自动排列等尺寸磁贴，自动换行）或者GridPane（可自定义行列跨度的固定网格），不需要手动计算每个磁贴的坐标，布局会自动完成排列，适配窗口尺寸变化。
• 调整HBox内部子控件位置时，不要修改layoutX/Y，要使用HBox提供的布局属性：
  • 用alignment属性设置子控件在HBox内的对齐方式，比如alignment="CENTER"可让所有子控件在HBox内垂直水平居中
  • 用spacing属性设置子控件之间的默认间距
  • 给单个子控件设置HBox.margin约束，调整该控件和其他控件、HBox边界的间距
• 只有Pane（基础无布局面板）、AnchorPane这类支持绝对定位的容器，手动设置子控件的layoutX/Y才会生效，其余带自动布局规则的面板都会覆盖手动设置的坐标值。

把你原来Home标签页下AnchorPane里堆6个HBox的代码，替换成TilePane实现即可，不需要给每个HBox设坐标：

<AnchorPane minHeight="0.0" minWidth="0.0">
    <children>
        <!-- 3列磁贴布局，水平、垂直间距10px，每个磁贴固定尺寸400*386 -->
        <TilePane prefColumns="3" hgap="10" vgap="10" 
                  prefTileWidth="400.0" prefTileHeight="386.0">
            <HBox fx:id="lastRaceHBox">
                <VBox>
                    <Button mnemonicParsing="false" onAction="#onHelloButtonClick" text="Hello!" />
                    <Label fx:id="welcomeText" prefHeight="17.0" prefWidth="68.0" />
                </VBox>
            </HBox>
            <HBox fx:id="nextRaceHBox" />
            <HBox fx:id="upcomingDatesHBox" />
            <HBox fx:id="rankingsHBox" />
            <HBox fx:id="goalsHBox" />
            <HBox fx:id="playerInfoHBox" />
        </TilePane>
    </children>
</AnchorPane>

内容的提问来源于stack exchange，提问作者taco22