使用AutoLayout将5个子视图均匀地分布在Xcode 7中的父级宽度上

时间:2016-04-12 13:30:50

标签: ios swift autolayout ios-autolayout

我在Xcode 7中使用AutoLayout尝试在视图中传播5个子视图时感到非常沮丧。我在collectionViewController的页脚中添加了五个视图,我希望这些视图能够均匀地展开 - 在具有不同宽度的设备上显示时是明智的。我能够在SO上找到一些线程但不幸的是它们都在Xcode 7中过时了,因为我没有评论,因为没有" 50声誉"我唯一的希望就是创建自己的主题。非常感谢帮助,香蕉花了好几个小时。

4 个答案:

答案 0 :(得分:2)

这应该是AutoLayout中非常简单的布局。

首先,您需要确保所有视图具有相等的宽度。在IB中,您可以全部选择它们并使用"添加约束"在Interface Builder中按下并按下" Equal Widths"按钮。在代码中,这稍微复杂一点,但同样可能。

其次,您需要确保每个视图的前沿和后沿都是"固定"对彼此。选择第一个视图和(使用"添加约束"按钮)将其固定到超级视图的左边缘。然后按CTRL-DRAG从第一个到第二个视图并选择"水平间距"。对每对视图重复此操作。

我还建议您查看www.raywenderlich.com网站,因为它们是一些非常好的AutoLayout教程。

答案 1 :(得分:0)

如果按代码添加:

REMOTE_CCY_PAIR

这将根据其位置(1-5)

应用约束

如果您使用func constraintsForView(view: UIView, position: Int, superViewWidth: CGFloat) -> [NSLayoutConstraint] { let views = ["view": view] let hDistance: CGFloat = (superViewWidth / 5.0) * CGFloat(position) var constraints = [NSLayoutConstraint]() let h = "H:|-\(hDistance)-[view]" let v = "V:|[view]|" let H_Constraint = NSLayoutConstraint.constraintsWithVisualFormat(h, options: [], metrics: nil, views: views) ?? [NSLayoutConstraint]() let V_Constraint = NSLayoutConstraint.constraintsWithVisualFormat(v, options: [], metrics: nil, views: views) ?? [NSLayoutConstraint]() constraints.appendContentsOf(H_Constraint) constraints.appendContentsOf(V_Constraint) constraints.append(NSLayoutConstraint(item: view, attribute: .Width, relatedBy: .Equal, toItem: view.superview, attribute: .Width, multiplier: 0.2, constant: 0)) return constraints } 然后将第一个视图放在左侧,然后将其宽度设置为superview并将乘数更改为0.2,则将下一个视图附加添加到第一个视图,再次等宽,继续执行同样直到第5,只是上/下/左/右

答案 2 :(得分:0)

您可以固定相等的宽度约束。如果使用IB,则选择子视图和父视图设置等宽约束,然后根据需要编辑它的乘数。或者只是以编程方式给出约束。

答案 3 :(得分:0)

由于没有附加代码,我将分享我在AutoLayout中的一些经验。

有两个要点: 1.确保您完全理解Autolayout的机制和原则。 2.绝对需要练习,但你需要从简单的案例开始。

我建议您开始使用xib或storyboard,因为它们清晰明了。一开始并不雄心勃勃,首先尝试在父视图中均匀地传播两个视图。

在练习xib的过程中,我为自己制定了两个步骤。 (1)添加任何需要的约束,只需确保一切正常,没有冲突。 (2)尽可能多地删除约束,同时确保一切仍然有效。

经过一些练习后,您肯定对Apple的自动布局LOGIC有了更好的理解,我认为这是最重要的事情。

最后,请耐心等待。每个问题都有解决方案。它就在那里等着你找出来。