真的很难与自动布局 - 4 个按钮排列 2x2

Really struggling with Autolayout - 4 buttons arranged 2x2

我的 Storyboard 中有一个相当简单的场景,但我无法使用 Autolayout 安排四个橙色按钮。

一周以来我一直在努力解决这个问题。我在网上搜索过,我一定没有合适的关键字,因为我没有找到任何适用的东西。

除橙色按钮外,其他所有设备均适用于所有设备。

橙色按钮应排列在 2x2 网格中。

我希望 "Question" 标签与第一行按钮之间的距离与第二行按钮与 "Home" 按钮之间的距离相同。

我希望橙色按钮保持相同的纵横比,并且我希望它们尽可能 grow/shrink,但它们应该在 "Question" 和 [=26] 之间水平和垂直居中=] 和 left/right 条边。

使用容器视图分治布局。

从顶部、中间和底部视图开始:

中间视图约束是:

  • 容器中的中心 X
  • Y 在容器中居中
  • 纵横比1:1
  • Leading/Trailing/Top/Bottom space = 10, 250 优先级
  • Leading/Trailing/Top/Bottom space >= 10, 1000 优先级

这将为您提供横向和纵向的支持:

现在您可以在中间视图中添加 4 个网格视图:

网格视图将具有相同的宽度和高度,并设置视图之间的间距。

你只能使用故事板做这么多。您将不得不插入一个插座并手动管理框架尺寸,或者您可以以编程方式使用自动布局来模仿您的预期行为。如果您愿意,我可以在编程部分帮助您。