Auto Layout 使用心得—— 实现三等分

本文转自https://lvwenhan.com/ios/431.html

Auto Layout 的本质原理

Auto Layout 的本质是用一些约束条件对元素进行约束，从而让他们显示在我们想让他们显示的地方。

约束主要分为以下几种（欢迎补充）：

1. 相对于父 view 的约束。如：距离上边距 10，左边距 10。
   
2. 相对于前一个元素的约束。如：距离上一个元素 20，距离左边的元素 5 等。
   
3. 对齐类约束。如：跟父 view 左对齐，跟上一个元素居中对齐等。
   
4. 相等约束。如：跟父 view 等宽。

三等分设计思路

许多人刚开始接触 Auto Layout，可能会以为它只能实现上面的1、2功能，其实后面3、4两个功能才是强大、特别的地方。接下来我们将尝试设计横向三等分：

1. 第一个元素距离左边一定距离。
   
2. 最后一个元素距离右边一定距离。
   
3. 三者高度恒定，宽度相等。（此处我们设置为高度恒定（height 属性），如果你需要的是固定长宽比，则需要设定 Aspect Ratio 属性）
   
4. 1和2、2和3的横向间距固定。

干货，实现过程的动图：

运行结果

4 寸：

4.7 寸：

纵向三等分实现方式类似，大家可以自己尝试一下哦~