如何将四个按钮水平和垂直居中？

Posted 2023-03-16

【中文标题】如何将四个按钮水平和垂直居中？

【英文标题】：How can I center four buttons horizontally and vertically?

【发布时间】：2017-11-29 18:37:07

【问题描述】：

我想将四个按钮水平和垂直居中。 每个按钮稍后都会获得背景图片，所以我认为长宽比保持或多或少相同很重要，否则图片将不适合按钮。

它应该是什么样子的屏幕截图：

所有按钮都具有相同的大小，并且应该占用尽可能多的空间（小边距，10 像素左右，如果可能，不要更多）。我不知道如何设置应用程序在所有设备（iPhone 5s 和 iPad 10.5"）上看起来都不错的约束。 应用程序不一定要在所有方向模式下运行。

如何设置约束？

【问题讨论】：

将四个按钮放在一个不可见的超视图中，并具有适当的约束并使超视图居中？

@matt 但是我必须对超级视图应用什么限制？仅中心 X 和 Y 是不够的。

正确。您需要将其前导和尾随与主视图的两侧联系起来，然后将其高度与宽度联系起来。通过单独安排来练习：学习使用自动布局制作最大的中心正方形。那么如何进行就很明显了。 （事实上​​，此时您可以只使用 UIStackView 配置。）

【参考方案1】：

这个问题可以很容易地简化为在其父视图中以最大平方为中心的问题。只需四个约束，您就可以轻松做到这一点：

其余的 - 按钮网格 - 只是落在你的腿上。例如，让我的蓝色视图成为一个包含两个 UIStackViews 的 UIStackView，这就是你的网格。或者您可以自己使用显式约束来完成。

如果此应用可以旋转，您可能需要两组约束，一组用于宽度小于高度的情况，另一组用于高度小于宽度的情况。然后，您必须在代码中交换它们。但这是另一个问题，并不难。

【讨论】：

是的，非常感谢，我解决了问题 ;-) 工作正常！

【参考方案2】：

将它们添加到 UIStackView，为了将它们水平放置，请使用 axis 属性的 horisontal 值，您可以使用 UIStackView 的分布、对齐和其他属性对其进行自定义。 这是最简单的方法