Swift - 自动约束

Question

我正在尝试使用xcode 7上的storyboard中的自动大小类来将UI元素定位在控制器中。我遇到的问题是当我尝试使用＆＃34;添加缺失的约束时＃34;函数（位于控制台的右下角），它正确定位我的UI元素，除了最后的元素（图片描述更好）。下面的第一张图显示了故事板文件，其中我只想要3个按钮（相互堆叠在一起）与任何屏幕右上角的宽度和长度相同。

然而，当我添加约束并运行模拟时，似乎顶部的两个按钮正确定位，具有正确的长度和宽度，但第三个按钮不合适（下图）。

所以我的问题是，我是否忘记了让所有按钮自行定位的步骤？或者我应该尝试将所有内容转换为百分比并根据屏幕的百分比放置UI元素（如果是这样，我将如何去做）？

我还尝试在第三个按钮下添加另一个空白按钮（删除按钮标签）并添加这样的约束，但它对我没有用。如果您有任何建议，请告诉我，谢谢！

Answer 1

在您的情况下，Autolayout您需要向UIButton提供约束是4个约束。

1. 龙头
2. 尾随
3. 宽度
4. 高度

如果你错过任何一个，那么你肯定会收到错误。那么，你的错误是什么？

对于第三个UIButton，你没有给出高度，而你给出了上面两个按钮。

因此，只需删除UIButton的底部约束，并将相等的高度设置为UIButton以上。

仅供参考，未经您方的任何确认，请勿使用Add Missing Constraints。

  

更新

观看此视频，以移除trailing或leading页边距：

http://sendvid.com/1h8deg18

Answer 2

如果在设置自动布局约束时使用“预览”屏幕，则实际上可以看到解决方案的实际效果。我刚刚创建了一个类似的视图和按钮，并逐步完成了整个过程。我给按钮着色并命名它们以使事情变得明显。

1. 我添加了三个按钮。此时，预览中没有任何按钮显示。





1. 然后我为Button1设置了自动布局约束。如果您希望按钮固定在右上角，那么您不必担心前导约束。你需要宽度，高度，顶部和尾部。





现在，Button1会在预览屏幕的右上角与其对齐。



1. 现在为Button2做同样的事情。设置宽度，高度，顶部（Button1的垂直空间）和尾部。





Button2现在将在预览中捕捉到位。



1. 现在Button3也是如此。您将第一个按钮锚定在屏幕的右上角。然后Button2到Button1的底部和屏幕的右边缘。然后再次为Button3。如果您更喜欢尾随空格，也可以对齐第2和第3个按钮的边缘。





现在，无论设备如何，您都会在预览中看到您的按钮位置正确。



只要您为每个按钮指定高度和宽度，就不必担心屏幕的左边缘或底边缘。他们每个人都知道＆＃34;坚持＆＃34;在右上方，他们知道大小。

**注意：如果您不熟悉＆＃34;预览＆＃34;选项... 打开故事板后，按住Option并再次选择故事板，以获得右侧故事板的另一个副本。在左侧突出显示您感兴趣的视图控制器。在右侧，选择“预览”选项，如下所示。



现在，您可以将故事板和预览放在一起，这样您就可以看到所做的任何自动布局更改的确切影响。您还可以在预览中添加或删除设备。