IOS中NSLayoutConstraint的使用

在IOS6以后，苹果推荐使用NSLayoutConstraint进行界面布局，但是，这个东西如果用代码来整，写起来感觉乱糟糟的，也不好维护，不怎么能看懂，自己写的约束，可能不久后就忘记是什么意思了，因为一个界面元素需要加多个约束才能正确显示。也有第三方封装的框架，使用起来相对容易一些。

在IOS设备尺寸不是那么多的时候，我们可以用代码以及xib加上autoresizingMask就可以搞定布局。但是，现在IOS设备尺寸越来越多了。不使用autoLayout，貌似工作量直接翻翻了。所以，必须得学习这个东西了，首先你得学会在storyboard中使用它。

但是，storyboard中写的是初始化的布局。如果你的app需要添加动画，或者改变位置，那么，你就必须学习使用代码进行页面布局了。

（一）如何使用storyboard进行页面布局

在IOS8或者说iPhone6出现以前，在storyboard中仅仅使用约束进行布局，在iPhone6出现以后，我们用 size classes结合auto layout进行布局。如何在storyboard中使用这两种技术呢？

首先，你需要勾选中这两个选项。

1.1 SizeClass在Storyboard中的使用

打开storyboard，你会发现viewcontroller的默认尺寸是600*600.注意，在storyboard底部多了 wAny,hAny等字样。如下图所示：

这里的w，很显然就是width的意思，h就是height的意思。那么后面的any和any是什么意思，猜想一下就是任意的屏幕，不管什么屏幕都按照这个布局进行显示。 

点开（点击wAny hAny）你会看到一个3*3的长方形,如下图所示：

你可以在弹出的界面中，移动鼠标，你会发现，随着鼠标的移动，界面上的文字会随着变化。例如选择3*3，如下：

 上面的文字变成了Regular Width | Regular Height，点击鼠标，下面的wAny hAny 也变成了wRegular hRegular.现在，在Regular*Regular的界面上托一个Label,像下面这样。

然后，运行选择不同的模拟器，运行程序，你会发现，只有在Ipad上面才会显示，你刚才拖进storyboard里面的label。这是为什么呢？

其实，这就是Size Class所起的作用。现在，你应该知道不同设备上运行出来的效果不一样，是Regular起得作用，对应Regular，还有一个Compact。我们来看看不同的设备和Regular以及Compact的对应关系。

设备	设备方向	Width	Height
Ipad	（横、竖）	Regular	Regular
Iphone4（s） Iphone5（s） Iphone6	横	Compact	Compact
Iphone4（s） Iphone5（s） Iphone6 （plus）	竖	Compact	Regular
Iphone6 plus	横	Regular	Compact

在Storyboard中你需要了解的不同Size（Any除外）就对应上面的表格。

1.2 autolayout在storyboard中的使用

（二）使用代码进行约束布局

代码中使用下面两个方法进行布局

+ (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts metrics:(NSDictionary *)metrics views:(NSDictionary *)views;

+(instancetype)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2 attribute:(NSLayoutAttribute)attr2 multiplier:(CGFloat)multiplier constant:(CGFloat)c;

第二个方法看参数就知道怎么调用了。

第一个方法需要使用一种叫visualFormat的语言对布局进行描述，如：

@"H:|[button(==100)]-(10)-[image(==300@1000)]-|"