Xcode添加约束以便ImageView

Question

我正在Xcode中创建一个应用，其中屏幕中间有一个主干，右边有一个分支，如图所示（我已经放了两个代表主干和分支的按钮。蓝色按钮是主干，而红色按钮是分支。）

使用约束我设法在每个iPhone设备中正确调整行李箱的大小，但是我无法对分支执行相同的操作。

你能告诉我如何使用约束来保持主干和分支的这种配置吗？

我尝试过添加： - 使用“当前画布值”在容器中水平对齐 - 比率 - 与Trunk成比例的比例 但它不起作用

以下是代表行李箱和分支的按钮图像：

Answer 1

您可以使用8个约束来执行此操作：

1. BlueButton.Top = Superview.Top.Margin
2. BlueButton.Bottom = BottomLayoutGuide.Top
3. BlueButton.Width =具有乘数3:10
的Superview.Width
4. BlueButton.CenterX = Superview.CenterX
5. RedButton.Leading = BlueButton.Trailing
6. RedButton.Trailing = Superview.Trailing.Margin
7. RedButton.Width = RedButton.Height with multiplier 10:3
8. RedButton.Bottom =具有乘数0.4的Superview.Bottom（使分支在树的上方60％）

创建约束1和2：

单击蓝色按钮将其选中。单击 Pin [ - [] - ] 图标。打开顶部和底部橙色工字梁，然后单击 [添加2个约束] 。

创建约束3：

control -drag从蓝色按钮到白色背景。从弹出窗口中选择 Equal Widths 。要设置乘数，请再次单击蓝色按钮，然后在右侧的尺寸检查器中找到 Equal width to superview 约束。点击修改并将乘数设置为3:10。

创建约束4：

control -drag从蓝色按钮到白色背景。从弹出窗口中选择在容器中水平居中。

创建约束5：

control -drag从蓝色按钮到红色按钮。从弹出窗口中选择 Horizo​​ntal Spacing 。

创建约束6：

control - 从红色按钮的中心到背景的右边缘以45度角向上拖动。从弹出窗口中选择尾随空格到容器边距。

创建约束7：

完全在红色按钮内， control -drag up and right。从弹出窗口中选择 Aspect Ratio 。在尺寸检查器中找到比率约束，单击编辑并将倍增器设置为10:3

创建约束8：

最后一个是最难的，但你可以做到！单击红色按钮。现在，在故事板左侧的文档大纲中，您将看到该按钮以灰色突出显示。按住命令键并单击包含该按钮的View。当视图和按钮都突出显示时，它应该如下所示：



现在，点击对齐图标（ Pin [ - [] - ] 左侧，点击<的复选框em> Bottom Edges ，然后单击 [Add 1 Constraint] 。

现在，再次单击红色按钮，在尺寸检查器中找到底部空间：Superview 约束。双击它打开它：



这就是我们想要它的样子。你可能不得不改变两件事。如果您的第一项是 Superview.Bottom ，那么您需要交换第一项和第二项。为此，请单击 Superview.Bottom 并选择反向第一和第二项。

接下来，将乘数更改为0.4这意味着红色按钮的底部距离顶部的40％是Superview的底部，这使得红色按钮为60％从屏幕底部向上。

呼！那就是它！

Answer 2

1. 首先给分支按钮一个高度。
2. 然后给前导空格截断按钮零和尾随空格到superview零。

现在只需要一个信息就可以使xcode正确运行自动布局。即分支按钮的位置。 如果您希望您的分支机构位于垂直中心

1. 将容器constaint中的竖直中心赋予分支按钮