用autolyout实现子视图对齐等宽排列

最终效果

用autolyout实现子视图对齐等宽排列_第1张图片
实现效果

IB中实现

用autolyout实现子视图对齐等宽排列_第2张图片
组成部分

其实,要让三个button三等分,那么一定要找一个view作为参考,所以我在底部加了一个bottomLine(距离左边0,距离右边40,距离底部0,高度为1),重要的是,我设置为隐藏。那么,分别让每个button等于bottomLine的三分之一,那么就等分了。

用autolyout实现子视图对齐等宽排列_第3张图片
三分之一的约束

当然,三分之一的约束只是约束了每一个button的宽度,位置、高度,还要另外针对每一个设置,比如最左边的上架时间(约束:距离左边0,距离顶部0,距离底部0),其它同理之。

最后,三条竖线,位置分别距离左边button为0,顶部、底部留距离,宽度设置为1,设置一个灰色背影就行。


用autolyout实现子视图对齐等宽排列_第4张图片
三条竖线约束

用代码实现约束

有了上面的思路,用代码实现应该也是一样的,用Masonry来写约束吧,代码就不写了(Swift还在学,不敢教)。

  • 如果有什么疑问,可以在评论区一起讨论;
  • 如果有什么不正确的地方,欢迎指导!


注:本文首发于 iHTCboy's blog,如若转载,请注明来源。

你可能感兴趣的:(用autolyout实现子视图对齐等宽排列)