ios 使用自动布局在另一个 View 中放置 3 个 View

Question

我简单说明一下情况:里面有一个ViewController VC和一个View V，布局约束如下:

• 到VC的水平(左右)间距为0
• 到 VC 的垂直(仅底部)间距为 0
• 宽高比 75:23

像这样:

 ____
|    |
|    |      
|____|           
|____| <- V

我想在 V 中放置 place 3 view，所以假设我们将 V 分成 4 block :

 ___________ 
|  |  |  |  |
|  |  |  |  |
|__|__|__|__|

I wanna place my new 3 Views V1, V2 and V3 like this:

 ___________ 
|  |  |  |  |
| [1][2][3] |
|__|__|__|__|

that is, all centered vertically on V middle and the View Vi on (i/4) of V width.

我如何在 Storyboard 中执行此操作(无需代码)？

Answer 1

Connor 的回答肯定有效，您可以做的另一件事是使用 NSLayoutConstraint 乘数。以下是步骤:

1) 创建三个宽度相等的不同 UIView。对于此示例，我使用了 UIImageView，但这与此目的无关。

2) 将每个设置为具有相同的垂直约束(即距底部 50pts，或将每个设置为“在容器中垂直居中”

3) 要将它们在水平面上均匀分布，您可以将它们分别设置为“在容器中水平居中”。

4) 一旦每个 View 在容器中水平居中，更改它们的倍数以确定 View 在 x 轴上的中心点与父 View 在 x 轴上的中心点的距离。如果您希望三个 View 间隔均匀，我会将乘数分别设置为 (0.5, 1.0, 1.5)。

这是一张显示宽度和高度均为 50 的三个 View 的图像:

编辑 - 进一步解释:

这里发生的事情是你将 subview 的中心设置在 x 轴上以与父 View 的 x 轴中心对齐，但是当你设置乘数时，你告诉它设置为它的一小部分距离。当它设置为 1.0 时，您是说您希望 subview 的 centerX 为父 View 宽度的 0.5。当您将乘数设置为 0.5 时，您实际上是在说您希望 subview 的 centerX 为父 View 宽度的 1/2 的 0.5 (1/2 * 1/2 = 1/4)，所以您将 subview 的 centerX 设置为父 View 宽度的 1/4。与 1.5 相同 - 然后您说您希望 subview 的中心是父 View 宽度的 1/2 的 3/2 (3/2 * 1/2 = 3/4)，因此 subview 的 centerX 将是父 View 宽度的 3/4。