剩余空间中的自动布局居中视图(以编程方式)

Posted

技术标签:

【中文标题】剩余空间中的自动布局居中视图(以编程方式)【英文标题】:Auto Layout centering view in remaining space (programmatically) 【发布时间】:2014-10-06 12:45:33 【问题描述】:

如何以编程方式添加自动布局约束以使视图在剩余空间中居中(参见下面的示例图片)?

目前,我在底部添加了一个容器视图,然后将视图置于容器视图的中心,但我想知道是否有任何其他解决方案无需使用容器视图。

【问题讨论】:

【参考方案1】:

您需要添加一个间隔视图来执行此操作。

让我们从一些观点开始:

我将设置粉红色视图以占据根视图的前 70%。首先,我将它固定到根视图的所有四个边缘:

然后我将以两种方式编辑底部约束。首先,我确保第一项是粉红色视图,其次我将乘数设置为 0.7。然后我更新粉红色视图的框架:

接下来我将添加间隔视图。我不希望间隔视图在运行时可见,所以我将其隐藏。隐藏的视图仍然参与布局。在设置约束之前,我只是将垫片放在蓝色视图的左侧:

现在我将创建约束以使垫片从粉红色视图的底部延伸到根视图的底部。宽度无关紧要,所以我将它固定在超级视图的左边缘并使其变薄:

现在我已准备好设置蓝色视图。首先我给它一个固定的大小:

其次,我将在根视图中水平居中:

第三,我将它的垂直中心固定到垫片的垂直中心:

这就是我需要的所有约束。我将更新所有帧以进行检查:

我可以在助手编辑器中使用 Preview 进行测试:

请注意,间隔视图在预览中不可见,但仍参与布局。

【讨论】:

感谢罗布的详细回答。我目前正在使用类似的技巧(添加一个填充视图 A 下面的空白的容器视图,然后在该容器视图中居中视图 B。但是,我希望有任何其他解决方案不需要添加任何其他视图。我正在以编程方式执行此操作(不使用此特定视图控制器的界面构建器),因此添加帮助器/容器/间隔视图似乎是不必要的混乱。 如果你使用约束,这是必要的。 写得很好。谢谢罗伯。【参考方案2】:

接受的答案没有解决程序化替代方案(您在问题中强调)。

有一种编程方式可以做到这一点,而无需使用 ios 9 中引入的UILayoutGuide 向视图层次结构中添加额外的虚拟视图。

The documentation for UILayoutGuide够详细了。

This article 还添加了更多解释(Here 是文章中的更新代码)。

【讨论】:

以上是关于剩余空间中的自动布局居中视图(以编程方式)的主要内容,如果未能解决你的问题,请参考以下文章

自动布局 - 以编程方式定义异常约束

以编程方式自动布局不起作用

调整大小后使用自动布局以编程方式居中 UIImageVIew

使用自动布局以编程方式创建视图层次结构

如何以编程方式使用自动布局以编程方式添加 UIview?

使用 UILabel 以编程方式自动布局不起作用