真的很难与自动布局 - 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 个网格视图:
网格视图将具有相同的宽度和高度,并设置视图之间的间距。
你只能使用故事板做这么多。您将不得不插入一个插座并手动管理框架尺寸,或者您可以以编程方式使用自动布局来模仿您的预期行为。如果您愿意,我可以在编程部分帮助您。
我的 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 个网格视图:
网格视图将具有相同的宽度和高度,并设置视图之间的间距。
你只能使用故事板做这么多。您将不得不插入一个插座并手动管理框架尺寸,或者您可以以编程方式使用自动布局来模仿您的预期行为。如果您愿意,我可以在编程部分帮助您。