【问题标题】:iOS autolayout to center my view between two viewsiOS自动布局使我的视图在两个视图之间居中
【发布时间】:2014-01-28 06:31:19
【问题描述】:

如何在 Interface Builder 中设置自动布局以垂直排列视图,如图所示:

Top view 固定在屏幕顶部边缘,Bottom view 固定在屏幕底部边缘。 My view 应该在顶视图和底视图之间居中(因此到 Top view 的距离等于到 Bottom view 的距离)

【问题讨论】:

    标签: ios interface-builder autolayout


    【解决方案1】:

    这样做的方法是在可见视图之间放置 2 个不可见的“间隔”视图。

    您不能使空间具有相同的高度。但是您使用“间隔”视图并将它们放置在您的视图之间(与周围视图之间的间隙为 0)。

    然后,您为这些视图设置相同的高度,它们会将您的视图围绕My View 居中,与Bottom ViewTop View 具有相等的间距。

    即像这样……

    V:|[Top View][spacer1][My View][spacer2(==spacer1)][Bottom View]|
    

    编辑 - 另一种方式

    我只是想到了另一种方法。你可以有一个不可见的容器UIView,它位于Top ViewBottom View 之间,没有间隙。

    然后你将My View 放在这个不可见的视图中并垂直居中。

    【讨论】:

    • 为什么不保持等于顶部和底部视图的高度并在父视图中居中居中?
    • 那行得通。除了那不是问题所在。问题中的图像清楚地显示了不同高度的顶视图和底视图。此外,它要求在两个视图之间准确地居中视图。它不会询问在其父视图中将视图居中。
    • @brigadir 是的,在 Interface Builder 右下角的按钮之一中,它具有“更新框架以匹配约束”和“更新框架约束”的选项。你想要第二个。
    • 我认为他是在说“另一种方式”比原来的答案更好,而不是第三种方式更好。 :)
    • 我刚刚使用了您的另一种方式,非常容易设置,谢谢!
    【解决方案2】:

    另一种解决方案是在 top viewbottom view 之间添加一个不可见的视图,并将 my view 放置在该视图的中心:

    【讨论】:

    • 这样的天才黑客!非常感谢
    【解决方案3】:

    (5 年后)我找到了最规范的解决方案:

    UILayoutGuide 专门用于解决此类任务(iOS 9 起)。

    使用布局指南替换您可能创建的虚拟视图,以表示用户界面中的视图间空间或封装 - Ref docs

    它在代码中工作得很好,但不幸的是 Interface Builder 不支持自定义布局指南。

    【讨论】:

      【解决方案4】:

      此视频对界面生成器中的自动布局和约束进行了惊人的概述:https://www.youtube.com/watch?v=1j-Frd5snYc

      【讨论】: