[iOS开发]屏幕适配二：Xcode7使用Autolayout拖拽布局基础（1）

标签：

参照自动布局教程一我们在Xcode7中来实现一下这个界面（由于教程是较早的Xcode版本所以来重做一遍）Xcode7中已经没有了pin这个选项了。

设计图如下：

实现步骤一：在Stroyboard上拖拽三个view并用不同的颜色表示，将他们修改到与设计图相似的大小效果图如下

实现步骤二：通过观察设计图可以发现三个view等高，上半部分两个view等宽，按住command单击选中三个view，使用autolayout约束为等高，同样选中上部两个view约束为等宽，实现过程如下：

同样的方式来处理上半部分两个view的等宽

实现步骤三：根据设计图调整view的位置，并设定view与super view的约束（现在约束的错误暂时不需要处理），单个选中view1设定他的top和left的约束为20

用同样的处理方式来设定view2 的top和right的边距约束，view3的bottom，left、right的边距约束，约束值为20，实现效果如下：

实现步骤四：设定三个view之间的相对距离，选中view2设定lift约束的时候回发现有两个选项，一个值比较小，一个值比较大，默认的是值比较小的哪一个，值比较小的选项是相对view1的距离值比较大的是相对super view的距离，这里使用默认的约束值：

使用同样的方式来处理view相对view1和view2的相对距离，处理完成效果如下：

最后一步：这时候你会发现之前红色的报错消失了，只剩下黄色的警告了，这说明你在约束上没有问题了剩下的只是控件的frame问题。接下来要做的就是单击每个警告，逐步解决每个警告问题就可以了。也可以选中所有view直接update frame一下解决所有问题，最终效果如下：

执行一下检验一下效果（至此布局基础第一节就到此结束了是不是很简单呢）：

直接执行效果：

嘿嘿再旋转一下：

ok检验结束，愿能给有缘人，解惑答疑。

[iOS开发]屏幕适配二：Xcode7使用Autolayout拖拽布局基础（1）

标签：

原文地址：http://blog.csdn.net/u010983974/article/details/51051643