如何让Auto Layout按比例为每个设备设置一个图标网格

Question

在设置故事板时，我遇到了一些关于自动布局的问题。

我希望我的应用程序显示在每一代iPhone上都相同（图像大小，间距，比例）。

通过将每个UIImageView设置为具有中央自动调整功能和Aspect Fit内容模式，我在某种程度上实现了我想要的结果;但是，一旦我将UIImageViews放入Stack Views，我就无法得到相同的结果，我认为这是设置此4x4图标网格的正确方法。

非常感谢任何帮助，如果需要澄清，请告诉我。

Answer 1

Stack Views是为了简化事情。

1 vertical 堆栈视图中需要4个水平堆栈视图。

然后，在垂直（主）堆栈视图中只需要4个约束：左，右，底和纵横比（1：1）。

堆叠视图配置完全相同：填充和填充相同 在我的例子中，我还为每个堆栈视图添加了10个空格。

像这样：

  

加分：请注意我没有使用UIImageViews，而是自定义UIViews，   它在运行时绘制自己。你甚至可以在那里进行预览   Xcode通过@IBDesignable和@IBInspectable。

<强>结果

iPhone SE：

iPhone 6：

iPhone 7 Plus：

看看代码：

  

git clone git@github.com:backslash-f/grid-on-stackview.git

（请给Stack Views一个机会。： - ））

Answer 2

如果上面给你带来了困难，那就不是这种情况，你可以使用容器视图AutoLayout固定到3个边缘。然后在容器视图中放置https://developer.apple.com/reference/uikit/uicollectionview并使用数据源设置集合视图。这就是我过去解决这个问题的方法。务必关闭滚动，反弹和控制数据源项的数量，以完全适合网格的数量。