如何用Storyboard实现网格布局？有无无需计算坐标及旋转调约束的简便方案？

嘿，很高兴能帮你搞定这个网格布局的问题！完全不用手动计算size/4再乘索引来确定坐标，也不用每次设备旋转都手动调整约束——苹果提供了几个更优雅的原生方案，在Storyboard里就能轻松实现自适应的网格布局。

方案一：用UICollectionView（推荐，适合动态/大量元素） #

UICollectionView就是为网格、瀑布流这类布局设计的，自带单元格复用和自适应能力，完全不用手动计算位置：

• Step 1：在Storyboard中添加CollectionView
  拖一个UICollectionView到你的ViewController，给它添加上下左右的约束，让它铺满整个可用区域。
• Step 2：配置单元格
  创建一个UICollectionViewCell子类，在Storyboard里设计好单元格的样式（比如添加按钮、标签），并将单元格的类关联到你创建的子类。
• Step 3：设置自适应布局
  • 如果是固定4列的网格：
    选中CollectionView，在Attributes Inspector里找到Flow Layout区域，设置Minimum Interitem Spacing和Minimum Line Spacing（比如设为8），然后可以通过代码动态计算Item Size（或者在Storyboard里用Auto Layout给单元格加宽度约束：让单元格宽度等于CollectionView宽度的1/4，再减去间距的均分）。这样旋转时，CollectionView会自动调整单元格大小和位置。
  • 更灵活的话，用UICollectionViewCompositionalLayout（iOS 13+支持）：
    在Storyboard里选中CollectionView，在Layout属性里选择Compositional Layout，然后可视化配置布局组（比如水平组包含4个项目，每个项目占组宽度的1/4），还能设置不同的间距、自适应规则，完全不用写计算代码，旋转时自动适配。

方案二：嵌套UIStackView（适合静态、少量元素的网格） #

如果你的网格是固定的（比如4x4的静态按钮组），用垂直StackView嵌套水平StackView的方式更简单：

• 拖一个垂直UIStackView到页面，设置它的Axis为Vertical，Spacing设为你想要的行间距，Alignment填Fill，Distribution填Fill Equally。
• 在垂直StackView里添加4个水平UIStackView，每个水平StackView的Axis为Horizontal，Spacing设为列间距，Alignment填Fill，Distribution填Fill Equally。
• 给每个水平StackView添加4个子视图（比如按钮），并给子视图设置宽高相等的约束（或者让它们自动填充StackView的空间）。
• 最后给垂直StackView添加上下左右的约束，铺满屏幕。这样设备旋转时，StackView会自动调整所有子视图的大小和位置，完全不用手动干预。

为什么不用手动计算？ #

不管是UICollectionView还是UIStackView，都是苹果原生的自适应布局组件，它们会自动处理：

• 不同屏幕尺寸的适配
• 设备旋转时的布局更新
• 间距、比例的动态调整
  你完全不需要手动计算坐标或者修改约束，这些工作组件都会帮你完成。

内容的提问来源于stack exchange，提问作者János