在Xcode 5中向父视图添加间距约束

74

我正在使用Xcode 5构建一个iOS应用程序,但是在添加布局约束时遇到了问题。在Xcode 4.x中,我可以将容器(父视图)的leading/trailing/top/bottom空间添加到任何UI元素中。现在,我只有这个选项:

enter image description here

我想要在我的文本视图中添加“底部到父视图”的约束。它说“与最近邻居的间距”,但我不想创建与“最近邻居”的约束,因为我的文本视图下面还有其他东西,我不想与那些东西创建约束。如果我的文本视图下面没有其他对象,它会正确地将约束添加到容器中。但是,如果我尝试更改任何内容,一切都会混乱:我需要将所有视图移动到另一个位置,然后添加约束,然后将其他视图移回来。如果我在文本视图和UI元素之间添加约束(在这种情况下是一个按钮),它不起作用(一切似乎都正确:按钮与superview的底部有一个约束,文本视图与按钮有一个垂直间距约束,没有冲突的约束)。这些UI元素在不同的(3.5英寸)屏幕方向中出现在屏幕范围外。接口构建器中有错误,还是我漏掉了什么?当我正确设置一切后,当我调整接口构建器屏幕大小时,我的控件仍然似乎超出了边界,但是在模拟器/设备上的3.5英寸大小的屏幕上显示正常。使用Xcode 5中的新接口生成器约束设计UI的“最佳实践”是什么?

更新:我在另一个项目中遇到了同样的问题。我试图通过CTRL拖动我的控件到“顶部布局指南”处来确切地修复视图的顶部,但它试图将我的控件底部与布局指南对齐(大约-470个点),而不是将控件顶部对齐,这毫无意义,因为该控件应该在可变高度的屏幕上布置自己(例如常规和4英寸的iPhone以及未来可能的其他布局)。以下是发生的情况的屏幕截图:

在此输入图片描述

我在约束中得到了这个:

在此输入图片描述

如何使界面构建器将视图的顶部与顶部布局指南对齐?

更新2: 我找到了一个解决方法。我首先调整视图大小以减小其高度(使其顶部不会重叠或非常接近顶部布局指南),然后再将其CTRL+拖动到顶部布局指南。它似乎可以正确地工作。连接后,我再次将视图调整为所需大小并选择 更新约束 。 它可以工作,但仍然不是一种解决方案,因为它需要调整视图大小、连接、再次调整视图大小并更新约束。


嗨,当将视图连接到顶部布局指南时,我遇到了与您相同的错误。一开始它让我很困惑,但后来找到了与您相同的解决方法。希望这个问题在未来的更新中能够得到修复... - Taum
希望如此。很遗憾看到一家真正关心设计的公司在其用于设计核心界面的产品中存在设计错误。 - Can Poyrazoğlu
这个解决方法有效! - Leszek Zarna
4个回答

94
为了在视图和其父视图之间添加约束(如“底部空间到父视图”),您可以使用文档大纲(界面生成器的左侧部分)。
在文档大纲中:
1. 按住 Ctrl 键并将视图从其父视图拖动到视图(或者反之)。 2. 选择要添加的约束(例如,“底部空间到容器”)。 从视图到其父视图(或反之)进行 Ctrl 拖动 选择要添加的约束

1
如果您想在按钮和选项卡栏之间设置约束,可以在文档大纲中从按钮向底部布局指南进行Ctrl拖动。 - Jarig
4
每当我尝试添加一个"向上布局指南的顶部间距"约束,它就会转变成一个带有负值的"底部间距到顶部布局"约束。这是Xcode的bug还是我做错了什么? - bugloaf
3
刚刚解决了自己的问题。原因是视图位于布局指南之上(因为它来自iOS 6),所以Xcode试图聪明地处理,而不是按照它说的去做。解决方法是选择所有内容并将其拖动到布局指南之下,尽管我一直在尝试让Xcode自动执行这个操作。 - bugloaf
@Jarig,我在使用IB时又遇到了一个问题。我已经添加了更新,如果您能看一下就太好了。 - Can Poyrazoğlu
3
看起来Table ViewTop Layout Guide之间的“垂直空间”约束不想为零或负数。您可以这样做:1)将Table View下移至少1个点,以使其不直接靠近Top Layout Guide。2)设置Table ViewTop Layout Guide之间的“垂直空间”约束-现在应该是从上面开始。3)将Table View移回到与Top Layout Guide直接相邻的位置。4)将“垂直空间”约束的值更正为零。 - Jarig
显示剩余2条评论

48

Jarig的答案很好,但有时会导致意料之外的结果,正如评论中所指出的。

另一个选项是选择子视图,然后转到:

Editor > Pin > Top Space to Superview

或者你想要的任何约束条件。


7
这一点特别有用,因为尝试从上下文菜单或控制拖动中实现相同结果时,从未出现过“顶部空间到父视图”的选项,它总是“顶部空间到顶部布局指南”(Xcode51DP)。 - levigroker
7
谢谢这个。正如上面直接提到的那样,如果您的父视图是您视图控制器的视图,则Xcode似乎只想提供“顶部空间到顶部布局导航”,这并不总是您想要的。特别是在处理自动考虑顶部布局空间的控件时。 - Michael McGuire
我的项目中它被禁用了,我该怎么办? - codercat
1
谢谢。我浪费了很多时间来修复tableView的插入。我知道我必须将顶部空间固定到父视图。但是所有其他方法都被禁用了。你救了我的夜晚,现在我可以去睡觉了。 - MIWMIB
@codercat 你可以先尝试选择组件。在我的情况下,直到我选择了UITableView它才启用。 - MIWMIB
显示剩余3条评论

1

现在似乎是底部约束。 选择您的视图及其父视图,点击“对齐”,并勾选“底部边缘”

pic


1
它禁用了模式,我该怎么办? - codercat

0

如果您想如同Xcode 4中一样添加约束,请在视图中心CTRL拖动到您想要添加约束的左侧、右侧、上方或下方。然后,您将会看到一个窗口,在其中可以选择要添加的约束(根据您CTRL拖动的方向而定)。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接