【问题标题】：Using Auto-Layout in Interface Builder/Storyboards to create a grid type layout在 Interface Builder/Storyboards 中使用 Auto-Layout 创建网格类型布局
【发布时间】：2015-02-12 22:41:40
【问题描述】：

我正在尝试使用 Interface Builder/Storyboards 创建网格类型布局。我使用 UIImageView 作为背景图片，并将 UIButtons 放置在我想要交互的图像区域上。无论我尝试什么限制，我似乎都无法将按钮放到正确的位置。我附上了 Xcode 6 的屏幕截图，并在 GitHub 上提供了该项目的链接。非常感谢任何可以提供一些见解的人。

编辑

在听取了来自 cmets 的 Matt 的建议后，我创建了一个使用图像作为实际按钮的布局。它工作得很好，但我似乎可以让按钮正确地相互约束。我附上了一些我现在得到的图片。如果有人知道发生了什么，那就太好了！ GitHub 存储库也已更新。

作为说明，我有意将黑条留在底部。

我在 iPhone 4/4s 上看到的视图

【问题讨论】：

似乎集合视图在这里会是一个更简单的解决方案
"将 UIButtons 放置在图像区域上" 我的建议是：不要。让按钮本身成为图像的片段。这样你就不必让按钮弄清楚它们后面的图像在哪里；它们包含图像的片段。它们所要做的只是相对于彼此进行定位，这很简单。
谢谢马特，我会尝试这样做！
Matt，我尝试仅使用 UIButtons 创建布局，效果非常好。唯一的问题是按钮对于 iPhone 4 和 iPad 来说显得太长，但没有别的。有什么建议吗？

标签： ios xcode swift interface-builder uistoryboard

【解决方案1】：

遵循水平+垂直边到边定义原则

每个对象都必须有一个边到边约束。即你必须能够为任何对象虚拟地绘制一条约束线来定义它的边缘。
必须在水平和垂直方向上遵守规则 #1

例如，假设您不希望按钮调整大小：

为每个按钮选择一个固有宽度
将最左侧按钮的最左侧边距与容器对齐
为左侧的每个按钮添加水平间距约束
将最右侧按钮的最右侧边距分配给容器
选择适当的优先级

垂直重复。

【讨论】：

【解决方案2】：

请查看共享的 XIB。

您可以通过与 superview 宽度或高度约束成比例，+- 填充常量来实现它。

https://dl.dropboxusercontent.com/u/48223929/AutolayoutExampleView.xib

【讨论】：