JavaFX SceneBuilder中ImageView全屏时适配窗口宽度与标签间距的问题

核心方案：AnchorPane约束+ImageView缩放属性配置 #

直接按以下步骤操作即可实现需求：

1. 固定上下标签的位置

   • 选中顶部的「Amazing Airlines」Label，在右侧属性面板的Layout栏设置：
     • Top Anchor = 0
     • Left Anchor = 0
     • Right Anchor = 0
   • 选中底部的「Special offers」Label，同样设置：
     • Bottom Anchor = 0
     • Left Anchor = 0
     • Right Anchor = 0
       这一步让两个标签牢牢固定在窗口顶部和底部，宽度铺满窗口。

2. 绑定ImageView到标签间的空间

   • 选中ImageView，在Layout栏设置：
     • Top Anchor = 顶部Label的底部（可直接输入对应数值，或在SceneBuilder里拖动锚点到顶部Label下边缘）
     • Bottom Anchor = 底部Label的顶部（同理拖动锚点到底部Label上边缘）
     • Left Anchor = 0
     • Right Anchor = 0
       此时ImageView的宽度会自动铺满窗口，高度会填充两个标签之间的所有剩余空间。

3. 关闭图片比例锁定，强制铺满

   • 切换到ImageView的Properties面板，找到Preserve Ratio选项，取消勾选。
   • 确保Fit Width和Fit Height不设置固定值，让AnchorPane的约束自动控制尺寸。
     这是关键步骤——默认开启的Preserve Ratio会让图片保持原比例，导致无法完全填充指定空间。

备选方案：用VBox布局简化配置 #

如果AnchorPane锚点设置容易出问题，可以换用VBox作为根容器：

• 把根容器改成VBox，设置Fill Width为true。
• 将顶部Label、ImageView、底部Label依次放入VBox：
  • 给顶部和底部Label设置VBox.vgrow为NEVER（固定高度，不占用额外空间）
  • 给ImageView设置VBox.vgrow为ALWAYS（占用所有剩余空间）
• 对ImageView同样取消Preserve Ratio的勾选，设置Fit Width为Double.MAX_VALUE。

这样无论窗口如何缩放，ImageView都会自动铺满横向宽度，纵向填充两个标签之间的所有空间，无需手动调整锚点。

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