JavaFX/FXML如何在HBox/VBox中按比例均匀放置界面元素

你当前写法的核心问题是依赖控件自身的padding、alignment属性硬凑位置，没有利用布局容器的空间分配能力：HBox默认只会按照控件的固有尺寸排列，不会自动分配横向剩余空间，固定像素的内边距在窗口缩放、分辨率变化时必然出现偏移。

下面是两种可直接落地的实现方案，都支持窗口自适应，不会出现错位：

方案1：保留现有HBox结构，改动量最小 #

在HBox中插入无固有尺寸的Region作为可伸缩留白，给Region设置HBox.hgrow="ALWAYS"属性后，布局会自动给所有可伸缩元素分配均等的剩余空间，实现均匀排布。
修正后的FXML代码：

<VBox xmlns:fx="http://javafx.com/fxml" prefHeight="400" prefWidth="600">
    <HBox alignment="CENTER" VBox.vgrow="NEVER">
        <!-- 全局内边距，避免控件贴窗口边缘 -->
        <padding>
            <Insets top="20" bottom="20" left="20" right="20"/>
        </padding>

        <TextField promptText="Text1" prefWidth="60"/>
        <!-- 可伸缩留白，自动均分剩余宽度 -->
        <Region HBox.hgrow="ALWAYS"/>
        <Label text="Some text"/>
        <!-- 第二个可伸缩留白，和第一个留白宽度始终相等 -->
        <Region HBox.hgrow="ALWAYS"/>
        <TextField promptText="Text2" prefWidth="60"/>
    </HBox>
</VBox>

关键配置说明：

• 两个Region的横向生长属性都设为ALWAYS，无论窗口怎么拉伸，两段留白的宽度始终相等，三个控件的相对位置保持均匀
• 删除了原来写死在TextField上的左右固定内边距，避免自适应时错位
• HBox的alignment="CENTER"属性保证所有控件在垂直方向居中对齐

方案2：用GridPane实现精准比例布局 #

如果需要严格按比例分配横向空间（比如三列各占1/3宽度），用GridPane配合列约束是最稳定的方案，完全不受控件固有尺寸影响。
FXML代码：

<VBox xmlns:fx="http://javafx.com/fxml" prefHeight="400" prefWidth="600">
    <GridPane VBox.vgrow="NEVER" alignment="CENTER">
        <padding>
            <Insets top="20" bottom="20" left="20" right="20"/>
        </padding>
        <!-- 定义3列，每列占总宽度1/3，分别设置不同的列内对齐方式 -->
        <columnConstraints>
            <ColumnConstraints hgrow="ALWAYS" percentWidth="33.3" halignment="LEFT"/>
            <ColumnConstraints hgrow="ALWAYS" percentWidth="33.3" halignment="CENTER"/>
            <ColumnConstraints hgrow="ALWAYS" percentWidth="33.3" halignment="RIGHT"/>
        </columnConstraints>

        <TextField promptText="Text1" prefWidth="60" GridPane.columnIndex="0"/>
        <Label text="Some text" GridPane.columnIndex="1"/>
        <TextField promptText="Text2" prefWidth="60" GridPane.columnIndex="2"/>
    </GridPane>
</VBox>

关键配置说明：

• 通过percentWidth直接定义每列占总宽度的比例，需要其他分配比例直接修改数值即可
• 每列单独通过halignment设置列内控件的对齐规则，不需要给控件单独加内边距凑位置
• 窗口缩放时所有列按比例同步拉伸，位置不会偏移

注意：JavaFX布局优先使用容器自带的空间分配、对齐属性实现自适应，不要用固定像素的padding、prefX/prefY硬凑位置，否则在不同DPI屏幕、窗口尺寸变化时必然出现布局错乱。

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