iOS ScrollView的AutoLayout布局+视图百分比布局

在这里，我将在Storyboard里使用Autolayout对scrollView实现自动布局！
我们要实现如图界面：

2.gif

其中：
2的宽度是屏幕宽度的0.625
3、4的宽度是屏幕的0.3，他们之间的距离位屏幕宽度的0.1
别问为什么要用这几个数字，他们方便而已。。。你也可以试试其他的

1.首先我们创建一个工程在viewcontroller里面添加一个scrollView并设置以下约束：

1.png

*** 注意：最好不要勾选Constrain to margins *** 然后更新一下Frame(快捷键 command + option + =)
2.将ViewConteoller的size设置成Freeform,并将高度搞到800来，再更新以下scrollview的frame, 然后 添加5个Label 1\2\3\4\5,这里会报红，别管他
3.现在我们设置1的约束，没什么说的，就是上左右再加上高度，在设置它居中：如图：

3.png

4.现在设置2的约束

• 按住ctrl点中2往父视图上拖，松手选择Equal Width,然后点击该约束，在右侧修改其属性：如图

4.png

• 在将2的宽高调成1：1

5.png

• 最后，将它居中OK

5. 现在将3，4的约束设置好就差不错了

• 将3、4的宽高比设成1：1，即相等
• 将3、4的宽度设成屏宽的0.3倍，参考2的设置
• 修改3的Leading（左边距）,设置成如图：

1.png

• 将4的Trailing（右边距）设置成如图：
  先将Fist item 与 second item调换（下拉Fist item的下拉框，选中最后一个选项） ，变成如图，在设置

  
  
  

  1.png
• 将3、4 top bottom 约束设置好，ok
  6.将5的约束 居中、宽、高设置好，OK ，大工告成！

---

---

Demo下载
这里还有一个关于TableViewCell高度自动布局的Demo,暂时没时间写文章，有兴趣的可以去看看，很简单的！

写的比较匆忙，望见谅。。。