iOS如何仅通过Storyboard实现不同屏幕下界面元素自动缩放适配

全程不需要编写Swift代码，所有操作都在Storyboard可视化面板完成，按以下步骤配置即可解决小屏裁切、图片消失、大屏元素显示不一致问题：

第一步：修正根垂直StackView的约束 #

仅设置居中、或仅固定左右边距的约束逻辑是不完整的，按以下规则重设约束：

• 给根StackView添加上下左右四个方向的边距约束，绑定对象选Safe Area（不要直接绑定父视图边缘），左右边距设为16~20pt固定值，上下边距按设计需求设置
• 把上述四个边距约束的优先级从默认的1000（强制）调整为750（高优先级）
• 保留StackView水平居中、垂直居中的两个约束，优先级保持1000即可

第二步：调整StackView核心属性 #

选中根StackView，在右侧Attributes Inspector面板修改参数：

• Alignment 选择 Fill，不要选Center、Leading等其他选项，避免子视图布局规则错乱
• Distribution 选择 Fill Proportionally，不要选Fill Equally、Equal Centering这类强制等分布局的选项
• Spacing 填入设计需要的固定间距值即可

第三步：配置子元素自适应规则（解决图片消失、显示异常核心步骤） #

文字标签（UILabel）配置 #

• 选中所有文字标签，在Size Inspector面板调整优先级：
  • Content Compression Resistance Priority（内容压缩阻力）：垂直、水平方向均设为750
  • Content Hugging Priority（内容吸附优先级）：垂直、水平方向均设为250
• 切回Attributes Inspector面板，勾选Adjust to Fit，最小缩放比例设为0.7，允许空间不足时文字自动缩小不被裁切

骰子图片（UIImageView）配置 #

小屏图片消失、大屏个别骰子大小异常，本质是图片的布局优先级设置错误：

• 选中所有骰子图片，在Size Inspector面板调整优先级：
  • Content Compression Resistance Priority：垂直、水平方向均拉满到1000，告诉Auto Layout绝对不允许把图片压缩到0尺寸（即消失问题）
  • Content Hugging Priority：垂直、水平方向均设为250，允许大屏空间充足时图片等比放大，不会出现大小不一致
• 切回Attributes Inspector面板，Content Mode选择 Aspect Fit，避免图片拉伸变形
• 不要给图片加固定宽高约束，如需保持骰子正方形显示，给每个图片添加1:1宽高比约束，约束优先级设为900即可，空间不足时会自动等比缩小

第四步：验证适配效果 #

所有配置完成后，在Storyboard底部切换不同尺寸的预览设备（优先测试4.7寸iPhone SE这类最小屏、以及设计参考的大屏设备），点击右下角Resolve Auto Layout Issues -> Update Frames，如果出现约束报红，检查是否存在多余的固定宽高、固定位置约束和上述自适应规则冲突，删除多余约束即可。

配置完成后所有元素会根据屏幕尺寸自动调整大小，不会出现边缘裁切、图片消失、显示不一致的问题。

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