Xcode Interface Builder：将视图中心X设置为其父视图的三分之一

Question

我有两个视图，我希望以它们等间距地水平排列。

我想定义它们的 Center X 为父视图宽度的三分之一和三分之二处，但我发现没有可以实现这一点的约束设置。

请问如何实现这个效果？

- Zoltán Matók

---

非常喜欢那个草图 :D - LinusGeffarth

Answer 1

你可以使用以下设置的 Center X 约束：

当然，对于第二个视图，Multiplier 必须是 2/3。

结果如下所示:

- André Slotta

Answer 2

从subView和Superview（仅限最后一个屏幕）中选择Align Center X 更改乘数： 第一个为2:3，第二个为4:3:

- Larme

Answer 3

您说：

我有两个视图，我希望它们水平等间距排列。我想定义它们的中心X，使它们成为父视图宽度的三分之一和三分之二，但我没有找到任何约束设置可以实现这一点。

值得注意的是，“等间距”和“中心X为父视图的1/3和2/3”实际上并不相同。考虑“1/3和2/3”的情况：假设父视图宽度为300像素，则1/3和2/3点分别位于100和200。如果添加两个宽度为50像素的子视图，则左右边距将各为75像素，但中心边距将为50像素。如果子视图更宽，则情况会变得更糟（例如，如果子视图宽度为100像素，则左右边距为50像素，但中间没有任何空间）。

如果您真的希望它们均匀间隔（其中子视图之间的水平间距与它们与其父视图边缘之间的间距相同），则可以在以编程方式执行时使用布局指南。

假设您已经创建了两个子视图并处理了它们的大小和垂直约束，那么您可以执行以下操作：

// create three layout guides

let layoutGuides = (0 ..< 3).map { _ in UILayoutGuide() }

// add them to your view

layoutGuides.forEach { view.addLayoutGuide($0) }

// create dictionary for VFL

let views = ["layoutGuide0": layoutGuides[0], "layoutGuide1": layoutGuides[1], "layoutGuide2": layoutGuides[2], "subview0": subviews[0], "subview1": subviews[1]]

// define horizontal constraints where three layout guides are the same width

let vfl = "H:|[layoutGuide0][subview0][layoutGuide1(==layoutGuide0)][subview1][layoutGuide2(==layoutGuide0)]|"

let constraints = NSLayoutConstraint.constraints(withVisualFormat: vfl, metrics: nil, views: views)
NSLayoutConstraint.activate(constraints)

如果您想在IB中执行此操作，则无法创建此类布局指南，但可以添加三个不可见的“间隔器”视图（即简单的UIView对象，其alpha为0），并将它们的相应宽度保持相等的约束。然后将这五个视图（两个子视图加上三个间隔器视图）放入堆栈视图中（或者，如果您是受虐狂，则绕过堆栈视图，并在这五个子视图之间添加六个前导/尾随约束），就可以实现两个均匀间隔的子视图（在这三个不可见的“间隔器”视图之间）。

因此，它看起来像这样（使三个“间隔器”视图可见，以便您可以看到发生了什么）：

当您将这三个间距视图的alpha设置为0（使它们不可见）时，其净效果如下：

- Rob