Xcode6中自动布局autolayout和sizeclass的使用

1、关于自动布局（Autolayout）

    在Xcode中，自动布局看似是一个很复杂的系统，在真正使用它以前，我也是这么认为的，不过事实并不是如此。

     咱们知道，一款iOS应用，其主要UI组件是由一个个相对独立的可视单元构成，这些可视单元有的主要负责向用户输出有用的信息，有些则负责信息的输入（交互），交互的过程当中每每还伴随有动画的效果，已达到整个信息传递的连贯性以及用户体验的细腻感。可视单元，在实际开发中主要是view、button等，那么这些可视单元的关系由两个基本的关系构成：兄弟关系和父子关系，整个视图单元就是一个树形结构：

    对于任何一个UI组件，肯定了它的（相对于父view）位置、大小也就肯定了它在整个UI视图中的展现效果。

    Autolayout（以及iOS8中新增的sizeclass）是为了解决这些UI可视单元或者元素是怎样布局、排列的问题。在过去只有iPhone4的时候，咱们能够在代码里将每个可视单元的位置写死，这样是没问题的，但随着iPhone五、6的发布，屏幕尺寸有了愈来愈多中可能，将来不排除更多尺寸的iPhone发布出来，这就要求咱们的APP的UI元素具备在屏幕尺寸不一样的设备上具备必定动态的可调性，已实现较好的UI展现效果。从目前苹果提供的技术来看，有下、中、上三种实现方法：

    下策是，代码中判断当前设备的尺寸，对UI元素进行手工的调整，其缺点是显而易见的：代码复杂、容易出错、且维护难度大、灵活性极差；

    中策是，经过设置可视单元（UIView UIButton...）的autoresizing属性，预设当该view所在的环境（父view）发生变化时它的尺寸和位置应该如何调整，该方法能够在Xcode的interface builder中（storyboard 或者 xib）设置完成，但其只能针对父子关系进行有限的调整，好比左边距是否固定，尺寸是否可变等，而对于兄弟关系的调整则没法实现，对于UI比较固定的APP这种调节方式也算基本知足需求；

    上策就是结合使用autolayout和sizeclass对UI可视单元的父子关系、兄弟关系进行全方位的调整，并且调节精度更高：不只能肯定一个view的位置尺寸的变化依据是什么，还能对这些依据加以不一样的优先级，先知足什么条件，再知足什么条件，对于重要的位置尺寸能够优先保证，这样整个APP就具备极强的动态可调性，知足不一样设备、不一样应用场景下的需求。

    在目前苹果手机苹果尺寸多达四种的状况下，显然新的APP必需要采用上策来解决视图组件的布局问题。

    Autolayout的做用很是明确：帮咱们肯定在不一样设备、不一样（父view）环境下，同一个可视单元所应具备合适的位置和尺寸，所以，当一个UIView上所施加的约束可以惟一肯定它的frame（x, y, width, height）的时候咱们的自动布局的使用才是正确的。而新手一般犯的两类错误就是约束不足（约束太少）和约束冲突两种（约束太多）。若是你给出的约束只可以肯定这个view的大小，或者位置或者位置中的某一个项（好比x）的时候，就会出现约束不足的状况，在xib或者storyboard中，会以黄色的警告出如今左侧提示框内；若是你给出的约束推导出了两个甚至多个互相矛盾的位置尺寸结果的时候，就产生了布局错误，在编译的时候直接就build不过。

2、关于iOS8新增的sizeclass属性

    在iOS8中，新增了Size Classes特性，它是对当前全部iOS设备尺寸的一个抽象，也是该抽象了，想一想如今多少种iOS尺寸的设备吧：iPhone4-5-6-6plus、iPad、iPad mini、iWatch，如何仍是按照之前那针对种特定设备来编写不一样的布局的话，必定是很糟糕的一件事情。

    如今有了sizeclass，事情就好办多了：你不是设备多吗，那咱们就只把屏幕的宽和高分别分红三种状况：（Compact, Regular, Any），也即紧凑、正常和任意。这样宽和高三三一整合，一共9中状况。以下图所示，针对每一种状况，若是须要的话，咱们能够单独在storyboard或xib中设置UIView的自动布局约束，甚至某一个button是否显示都是能轻松实现。

关于size class的详细解析，参考苹果文档和wwdc2014视频。

3、storyboard中autolayout和size class的无敌配合

    对Xcode的interface builder比较熟悉的童鞋应该对UIButton的超强定制性映像深入：经过选择button的不一样状态（normal、height、disabled...），咱们能够单独设置每一种状态，button的background image、image、text color等属性，见下图：

     而Xcode6中对自动布局的重大变动有殊途同归之妙：开发者能够根据实际须要，针对size class的九种组合中的某一种或几种分别进行自动布局的设置，这样，当APP运行于不一样屏幕、不一样旋转方向的时候，就能够根据当前环境的size class状况使用咱们预先设置好的布局信息，从而达到APP UI的极大灵活性。

    和设置UIButton的不一样状态的不一样属性相似，咱们首先选择一种size class，而后针对该种size class进行自动布局。下面咱们以一个简单的布局场景为例进行说明：

    假设，咱们想实现下面这个效果：横屏和竖屏头像和label都能正常的现实，且在“比较恰当”的位置：显然横屏的时候，高度处于压缩的状态，（height: compact），咱们须要先对正常的布局以外，还要添加一种（wAny, hCompact）size class的布局：

 首先，咱们对默认的sizeclass进行布局，肯定头像和label的位置和尺寸：

     设置完（wAny hAny）以后，点击wAny hAny文字（上图底部），选择（wAny hCompact）：注意点击后弹出一个九宫格浮框，拖动鼠标便可选择响应的size class，注意在右下角（红色方框表示），还能够选择是否install，若是取消勾选，则这个头像在当前size class下就不会被加载（天然也就不显示出来）。

     在新的size class下咱们开始添加新的布局，注意，这里并无覆盖上一种size class咱们定义好了得布局，只是针对当前的size class添加新的、独立的布局信息，狡兔三窟，Xcode6这下子一口气给了咱们九个窟窿，爽！

 布局完毕，运行起来，便可达到咱们想要的效果！