iOS 等间距视图

Posted 2023-03-15

【中文标题】iOS 等间距视图

【英文标题】：iOS equally spacing views

【发布时间】：2017-05-25 01:54:56

【问题描述】：

嗨，为什么这会在 iPad 2 air 上以这种方式出现？我关注了this。

我希望白色占位符的宽度更小。

【问题讨论】：

那么你想要的是左对齐标签吗？

您使用的是 StackView 还是仅使用约束？向我们展示您的代码。

您遵循了这一点，但不完全是，在左侧图像中，您在此颜色视图之间没有视图。

您可以使用堆栈视图并可以设置内容之间的空间。它将为您提供预期的结果

【参考方案1】：

如果您希望所有视图等间距，请使用水平UIStackView 并将间距属性设置为equal。

或者，如果您想通过约束手动执行此操作，则必须将视图的宽度 proportional 设置为 device/superView's 宽度。

例如，如果您的 iPhone/iPad 宽度为 320，如果您希望 4 视图等间距，则将 屏幕宽度除以 视图数 同时为视图设置等宽约束：

320 / 4 = 80 (Width of each view)

对所有需要的视图/按钮执行以下步骤：（我使用按钮作为示例） 我们从这里开始：

第一步： 将 Button1 的 Top 和 Leading 约束设置为其父视图，如下所示：

第 2 步： 将您的按钮设置为 Equal Width 和 Equal Height 的超级视图。

第 3 步： 现在您的按钮显然与您的超级视图具有相同的大小。这是有趣和简单的部分。通过编辑约束使按钮的宽度为父视图宽度的 1/4（如果您有 6 个视图需要等间距，则使其为 1/6）。

第 4 步： 将先前步骤中的约束应用于所有视图/按钮并更新框架以查看更改。

这些是第一个按钮的约束供您参考：

【讨论】：

首先，我用 stackview 尝试过，但有时无法在情节提要上调整它的高度和其他值。我不知道为什么。而且它在更大的设备上拉伸太多了。

今晚我会检查一下……你的做法似乎很有趣。这是有道理的，但我想不出哈哈……我还有一个问题。有没有办法让它的高度与宽度成正比？我已经用 stackview 试过这个，在更大尺寸的设备上，图标拉伸太多了。我不确定你的方法是否能处理它。

没有办法通过 IB 中的约束使高度与宽度成比例。但是有可能使用带有@IBInspectable 属性的自定义NSLayoutConstraint 子类来做到这一点。