Autolayout02-实例讲解

实例效果：

步骤1：
准备工作，首先取消Use Size Classes,勾选Use Auto layout，然后在viewController中拖动一个视图并填充红色，接下来将对该视图进行自动布局（详情介绍情况autolayout简介）这里就不做过多讲解，主要以实例为准。

步骤2：
按照上一张的方法添加约束，可能会报警告，主要是因为位置不对。需要修补一下。
修补方法01：直接点击警告，让他帮你修补
修补方法02：可以在添加约束的地方，选中第二个来修补。
如图所示：

步骤3：目前效果如下

我们发现问题，最后红色视图显示的时候是状态栏下面，并没有在最上面，原因是它相对于状态栏视图的位置，没有相对于父视图位置。

步骤4：解决没有显示在最上面的问题。

我们需要将最上面的那个约束删掉，重新添加约束。

选中最后一行top space to:top layout guide，然后按delete删除。
添加新约束：选中上面的线，点击右侧的小三角，选中view。。。。该选项（相对于父视图），在填充相对于父视图的位置大小为0，点击该面板下面的update frame刷新位置，最后点击添加一个约束的按钮，就ok了。

改变后效果图：

步骤5：接下来我们复制3个视图，让其布局到其他3个角落。会发现有很多错，原因是你同事把他们的约束都复制过来了，需要删除他们的约束，重新添加新的约束。

删除约束方法01：同上面一样，点击视图，删除右侧的所有文字。如图所示：

删除约束方法02：
选中最底部

然后clear constraints

步骤6：一次为他们添加约束。同时你如果点击数字旁边的小三角会发现他会自动让其相对于父视图。