JavaFX如何让VBox内的HBox仅占用自身内容所需宽度
问题描述
我在VBox容器中嵌套了一个HBox容器,多数同类问题都在咨询如何让HBox占满其父容器VBox的全部宽度,而我的需求恰好相反。该HBox内部放置的按钮数量会动态变化,因此HBox需要根据内容持续调整自身尺寸;但我为HBox添加背景色后发现,它始终占满VBox的整个宽度,导致无法实现HBox的居中对齐。
当前实现效果为参考示例图的上方样式,我需要实现示例图下方的效果:
我尝试使用如下代码进行设置:
HBox.setHgrow(wordButtonsBox, Priority.NEVER);
但该设置没有产生任何效果,测试用核心代码如下:
public class CentreStuff extends Application { @Override public void start(Stage primaryStage) { primaryStage.setScene(new Scene(createContent())); primaryStage.show(); } private Region createContent() { HBox buttonBox1 = new HBox(new Button("Button1"), new Button("Button2"), new Button("Button3"), new Button("Button4")); buttonBox1.setStyle("-fx-border-color: red;"); VBox results = new VBox(10, buttonBox1); return results; }
问题原因
你用错了API:HBox.setHgrow()是用来配置HBox内部子元素的水平拉伸优先级的,对HBox本身在父容器VBox中的尺寸行为完全不生效。
VBox的默认布局逻辑是:如果子节点的最大宽度无上限(HBox的默认最大宽度是Double.MAX_VALUE),就会把子节点拉伸到和VBox自身可用宽度一致,这就是HBox始终占满整行的根本原因。
解决方案
直接修改HBox的最大宽度限制,同时配置VBox的对齐规则即可,这是最简单也最适配你动态按钮场景的方案,只需要新增两行代码:
// 让HBox的最大宽度等于自身内容的理想宽度,不会被父容器拉伸 buttonBox1.setMaxWidth(Region.USE_PREF_SIZE); // 配置VBox内的子节点居中对齐 results.setAlignment(Pos.CENTER);
修改后的完整createContent方法代码如下:
private Region createContent() { HBox buttonBox1 = new HBox(new Button("Button1"), new Button("Button2"), new Button("Button3"), new Button("Button4")); buttonBox1.setStyle("-fx-border-color: red;"); // 限制HBox最大宽度为内容首选宽度,不被拉伸 buttonBox1.setMaxWidth(Region.USE_PREF_SIZE); VBox results = new VBox(10, buttonBox1); // VBox内子节点居中对齐 results.setAlignment(Pos.CENTER); return results; }
实现后HBox会完全跟随内部按钮的数量自动调整宽度,不会再占满VBox整行,同时始终保持居中对齐,和示例图下方的效果完全一致。
内容的提问来源于stack exchange,提问作者Hasen
相关产品推荐
相关产品推荐

