Xcode将屏幕分成4个巨型按钮

Question

我已经想出如何使用自动布局使所有按钮都可见，但我陷入了一个特定的目标：

我试图将屏幕划分为4个巨型按钮，每个按钮占据屏幕高度的1/2和屏幕宽度的1/2，彼此之间没有间距。我尝试设置约束，但按钮无法正常显示。

请看我在这里发布的两张图片，我想这样做，以便iPhone SE视图看起来与iPhone 7视图相同。上次我发布类似的问题，我的声誉有所下降，虽然我不知道为什么，我是一个刚刚开始自己​​的人，我正在努力解决问题所以请建议。谢谢！

Answer 1

以下是所需布局的约束截图。

我也要附上故事板。 File Download Link

没有顶部和底部视图

File Download Link

Answer 2

这可以通过约束完成，但也可以使用stackViews轻松完成。

let button1 = UIButton()
button1.backgroundColor = .red
let button2 = UIButton()
button2.backgroundColor = .blue
let button3 = UIButton()
button3.backgroundColor = .green
let button4 = UIButton()
button4.backgroundColor = .orange

let topStack = UIStackView(arrangedSubviews: [button1, button2])
topStack.axis = .horizontal
topStack.distribution = .fillEqually

let bottomStack = UIStackView(arrangedSubviews: [button3, button4])
bottomStack.axis = .horizontal
bottomStack.distribution = .fillEqually

let stackView = UIStackView(arrangedSubviews: [topStack, bottomStack])
stackView.axis = .vertical
stackView.distribution = .fillEqually

stackView.frame = view.bounds
stackView.autoresizingMask = [.flexibleHeight, .flexibleWidth]

view.addSubview(stackView)

Answer 3

请按照以下步骤操作：（非常简单易于实施）

1. 从所有视图中删除所有约束（橙色，红色，蓝色和绿色）
2. 选择所有四个视图，并为Top, Bottom, Leading & Trailing constraint指定常量值= 0（相对于您在快照中显示的位置）
3. 选择橙色和红色视图并指定Equal Width Constraint
4. 选择蓝色和绿色视图并指定Equal Width Constraint
5. 选择橙色和蓝色视图并指定Equal Height Constraint
6. 选择红色和绿色视图并指定Equal Height Constraint

查看此快照（参考约束，左窗格中提到了所有按钮）



最终观点