Iphone 自动布局:可以调整大小的superview中的两个UIView垂直居中

Iphone 自动布局:可以调整大小的superview中的两个UIView垂直居中,iphone,ios,autolayout,Iphone,Ios,Autolayout,我在superview中有两个UIButton,一个在另一个之上,其高度可以调整。这两个按钮之间应该有一个恒定的垂直间距,但顶部和底部间距应该调整大小,以便在调整大小时两个按钮在superview中保持居中 我尝试为每个按钮创建两个小于或等于superview间距的约束(具有相同的优先级),以及按钮之间的恒定垂直间距,如下所示: (此处小于或等于的原因是,对于4英寸屏幕,此视图在IB中的给定高度定义,但对于3.5英寸屏幕,此视图可以缩小。)但是,这并没有起作用,正如您在应用程序运行时从屏幕截图

我在superview中有两个UIButton,一个在另一个之上,其高度可以调整。这两个按钮之间应该有一个恒定的垂直间距,但顶部和底部间距应该调整大小,以便在调整大小时两个按钮在superview中保持居中

我尝试为每个按钮创建两个小于或等于superview间距的约束(具有相同的优先级),以及按钮之间的恒定垂直间距,如下所示:

(此处小于或等于的原因是,对于4英寸屏幕,此视图在IB中的给定高度定义,但对于3.5英寸屏幕,此视图可以缩小。)但是,这并没有起作用,正如您在应用程序运行时从屏幕截图中看到的:


这就好像您希望能够告诉AutoLayout这两个约束本身应该具有相等的值,即使它们都设置为“小于或等于”。有什么方法可以完成我想做的,或者更好的方法吗?

实现这一点的一种方法是将两个按钮包含在另一个UIView中,并将该视图置于控制器视图的中心。给按钮与此视图顶部和底部的固定距离,以及按钮之间的固定距离或视图的固定高度。

同意rdelmar。如果要保留视图层次结构,这里还有另一个选项

当前正在使用约束在顶部和底部隔开按钮。相反,创建两个空的
UIView
s,它们将用作间隔符。它们应该分别位于按钮的顶部和底部。使用自动布局约束,确保这两个间隔视图的高度始终相等。确保它们分别固定在按钮的顶部和底部以及superview的顶部和底部

在VFL中:
V:|-[spacer1(=spacer2)]-[button1]-(20)-[button2]-[spacer2(=spacer1)]-|


您可能必须在代码中执行此操作,我不确定IB是否可以执行此操作。

垂直居中的最简单方法是添加
nsLayoutAttributeCenter
约束-最好是添加到视图中心附近的元素。如果所有视图都有垂直间距约束,则它们都将居中。无需破坏视图层次结构或添加间隔视图

[self.view addConstraint:
    [NSLayoutConstraint constraintWithItem:button2 
                                 attribute:NSLayoutAttributeCenterY
                                 relatedBy:NSLayoutRelationEqual 
                                    toItem:self.view 
                                 attribute:NSLayoutAttributeCenterY 
                                multiplier:1.0 
                                  constant:0]];
如果需要调整定位,请设置常量。例如:
常量:-30
会将其上移30点


还可以基于视图的不同逻辑区域锚定元素。例如,如果要将第一个按钮固定在视图高度的25%,可以将乘数设置为
0.5

,这在IB中非常简单

(一)⌃ 从按钮1拖动到顶部。选择“在容器中水平居中”

(二)⌃ 从按钮1向左拖动。选择“在容器中垂直居中”

3) 对按钮2做同样的操作

4) 现在唯一要做的就是调整按钮的大小,因为这就是它的外观

这也很琐碎

(五)⌃ 从按钮1向左拖动。选择“前导空格到容器边距”

(六)⌃ 从按钮1向右拖动。选择“从尾随空间到容器边距”

7) 对按钮2执行完全相同的操作

成品,看起来像这样(注意,我没有把它们放在中心,但我可以很容易地做到):


您是在使用故事板还是界面生成器?IB中的故事板。我也尝试过这样做,但无法使其正常工作。在任何情况下,似乎您都可以不在另一个UIView中包装所有内容而完成我试图做的事情。@JamieForrest,我认为不在另一个UI视图中包装它是不容易的。我只需将两个按钮拖动到控制器的视图上,选择它们,嵌入UIView(从菜单),然后将视图居中即可。您是如何尝试的?您得到了什么结果?Autolayout的全部目的不是为了让我们不需要将视图封装到容器视图中吗?这个公认的答案并不准确。在第一节中,作者说只需添加centerX和centerY约束,就不会产生后续屏幕截图中显示的视觉效果。如果将两个UIView设置为同一个centerX和Y,则它们将按z索引堆叠。精确的屏幕截图将它们显示为单个按钮。当心。@garrettmurray将按钮拖到您想要的位置,然后执行步骤。您可能还需要更新约束。这将教您如何使用将根据方向的变化正确调整的居中约束。在我的回答中,我假设有一点关于自动布局的基本知识。@JasonMoore“用两个简短的句子描述ios布局”