ios7 - 自动布局 : Distribute views evenly, 中的 Spring 带有约束,在 Xcode 5 中

标签 ios7 interface-builder constraints xcode5 autolayout

我了解在 Interface Builder 中对齐、调整大小和分布 View 的旧 Struts 和 Springs 方法。但是,我似乎无法弄清楚如何使用 Xcode 5 的自动布局来均匀分布 View 。有一种方法可以使用 Xcode 4 来做到这一点,但该选项已消失。

我有 7 个垂直排列的按钮。在 3.5 英寸布局上,它看起来很棒。当我在 4 英寸布局中预览屏幕时,所有按钮都保持紧密排列,并且最后一个按钮下方有大量空间。

我希望它们保持相同的高度,但我希望它们之间的空间能够弯曲,以便它们可以在屏幕上展开。

enter image description here

我已经能够获得按钮的高度来弯曲并填充空间,但这不是我想要的行为。我想学习如何使用自动布局来替换我旧的 Springs 行为,但我似乎找不到任何方法通过 Interface Builder 来做到这一点。

我可以接受顶部按钮与顶部边缘的固定空间或与顶部边缘的成比例空间,同样对于底部按钮和底部边缘。这些对我来说不太重要,我都擅长。

但我确实需要弄清楚如何在 View 中的每个项目之间均匀分配额外的空间。

最佳答案

编辑 请注意,在 iOS 9 中,此技术将变得不必要,因为 UIStackView 将自动执行分发。我会添加another answer解释它是如何工作的。

如何使用自动布局执行均匀分布

单独在 Interface Builder 中执行此操作(而不是在代码中构造约束)的最简单方法是使用“间隔” View :

  1. 绝对定位顶部和底部按钮。

  2. 在所有按钮之间放置间隔 View 。使用约束将它们水平放置(水平居中最简单)并设置它们的宽度。

  3. 在每个按钮及其上方和下方的间隔 View 之间进行约束,常数为 0。

  4. 现在选择所有间隔 View 并将它们的高度设置为相等。

第一个屏幕截图显示了我在 IB 中进行的设置:

enter image description here

我故意不纠正“错误的 View ”,因为我希望您在我设计约束时看到它的样子。以下是 4 英寸和 3.5 英寸屏幕上的结果:

enter image description here

我将间隔 View 保留为黑色,只是为了向您展示该技术是如何工作的,但当然在现实生活中您可以将它们设置为透明,因此不可见!因此,用户只能看到您的按钮,均匀分布在屏幕的任一高度上。

使用此技术的原因是,虽然平等的概念执行您要求的值的分配,但约束只能在 View 的各个方面之间应用平等;因此我们需要额外的 View (间隔 View ),以便我们可以使一些东西与其他东西相等(这里是间隔 View 的高度)。

其他方法

显然,更灵活的方法是在代码中分配约束。这可能听起来令人畏惧,但是有很多第三方代码可以帮助您,例如 this sort of thing .

例如,如果我们有一个(可能不可见的) super View ,其高度作为边界来指示四个按钮的最大垂直分布,我们可以使用 constant< 将它们的顶部固定到该 super View 的垂直中心0,但 乘数0.0000010.6666671.33333、和 2.0 分别(如果我们有四个按钮);现在,即使 super View 根据屏幕高度或其他因素改变大小,按钮也将保持垂直分布。 [在 Xcode 5.1 中,可以在 Interface Builder 中进行设置,但在 Xcode 的早期版本中这是不可能的。]

关于ios7 - 自动布局 : Distribute views evenly, 中的 Spring 带有约束,在 Xcode 5 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20864823/

相关文章:

ios - 如何在 UIScrollView 中实现不可滚动的 UICollectionView?

swift - 为什么我的自定义类没有出现在 Interface Builder 的下拉列表中?

python - 控制洗牌距离

constraints - 给约束命名

ios - 在 iOS 8 上读取设备日志的 API

ios - 如何从自定义 UIGestureRecognizer 触发 NavigationController 的 interactivePopGestureRecognizer

ios7 - autonomousSingleAppModePermittedAppIDs 限制负载中的关键 - iOS 7 MDM

ios - 用 XIB 替换 Storyboard

ios - 在 Interface Builder 中设计 UITableView 的部分标题

python - <lambda>() 接受 1 个位置参数,但给出了 2 个