iOS第三方库Masonry解析

一.前言

之前写了一篇关于Autoresizing和一篇关于Autolayout的文章，里面对于iOS系统自带的约束讲解的很详细，所以，这里就不会对此作过多的叙述，要明白一点，就是Masonry是基于NSLayoutConstraint的封装，在block里面写约束，更为直观，更易于理解就OK了。

二.Masonry的基本使用

效果图：

MasonryDemo1.PNG

核心代码：

UIView *testView = [UIView new];
testView.backgroundColor = [UIColor brownColor];
[self.view addSubview: testView];
    
[testView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.top.mas_equalTo(self.view).offset(84);
    make.left.mas_equalTo(self.view).offset(20);
    make.width.mas_equalTo(80);
    make.height.mas_equalTo(80);
}];

代码非常简洁，易读，就算不知道实现的原理，也能看的出来，这几个约束是什么意思，Masonry的强大之处。

三.Masonry实现的原理

1.Masonry包含的所有文件

Masonry版本：1.0.2
-| Masonry    //引入Masonry所有的头文件
-| MASUtilities    //工具类
-| MASLayoutConstraint    //NSLayoutConstraint的子类，新增了mas_key属性，和当前的约束关联
-| MASConstraint    //创建约束的容器
  -| MASViewConstraint    //单个约束，MASConstraint的子类
  -| MASCompositeConstraint     //包含一个或者多个约束，MASConstraint的子类
-| MASConstraintMaker    //创建约束
-| MASViewAttribute    //主要让view和约束关联起来
-| MASConstraint+Private    
-| NSArray+MASAdditions    
-| NSArray+MASShorthandAdditions    
-| NSLayoutConstraint+MASDebugAdditions    
-| View+MASAdditions    //主要的类别
-| View+MASShorthandAdditions    
-| ViewController+MASAdditions    

2.详述Masonry设置约束的整个流程
以上面Masonry的基本使用为例：

[testView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.top.mas_equalTo(self.view).offset(84);
    make.left.mas_equalTo(self.view).offset(20);
    make.width.mas_equalTo(80);
    make.height.mas_equalTo(80);
}];

如下图：

图1

图2

从图1分析出：
1.View的扩展MASAdditions，里面有一个类方法mas_makeConstraints，该方法会返回该View的约束数组，传入一个block。
2.block传入MASConstraintMaker（负责管理两个View的约束）的实例make。
3.以make.top.equalTo(self.view.mas_top).with.offset(10)为例，make调用top属性再调用mas_equalTo方法，最后调用offset方法，完成一个约束的设置。这条语句最后会生成一个MASViewConstraint，然后存在MASConstraintMaker的constraints数组里，等block调用完毕，则会直接调用make的install方法。make的install方法里面会遍历constraints数组，然后逐条调用MASViewConstraint的install方法，最后在里面调用Object-C原生的方法设置两个View之间的约束。

四.使用Masonry的例子

1.二等分
效果图：

Masonry实现二等分.PNG

关键代码：

UIView *leftView = [UIView new];
leftView.backgroundColor = [UIColor greenColor];
[self.view addSubview: leftView];

UIView *rightView = [UIView new];
rightView.backgroundColor = [UIColor blueColor];
[self.view addSubview: rightView];

[leftView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.left.mas_equalTo(self.view).offset(20);    //leftView左边距离父控件20间距
    make.top.mas_equalTo(self.view).offset(84);
    make.height.mas_equalTo(100);
}];

[rightView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.right.mas_equalTo(self.view).offset(-20);    //rightView右边距离父控件20间距
    make.top.mas_equalTo(leftView.mas_top);
    make.height.mas_equalTo(leftView.mas_height);
    make.width.mas_equalTo(leftView.mas_width);    //关键leftView.width = rightView.width
    make.left.mas_equalTo(leftView.mas_right).offset(20);    //rightView左边距离leftView右边20间距
}];

2.约束动画
效果：

MasonryAnimate.gif

核心代码：

UIView *animateView = [UIView new];
animateView.backgroundColor = [UIColor greenColor];
[self.view addSubview: animateView];
    
[animateView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.left.mas_equalTo(self.view).offset(20);
    make.top.mas_equalTo(self.view).offset(84);
    make.height.mas_equalTo(100);
    make.width.mas_equalTo(100);    
}];

//通过更新约束触发动画
//只能更新已添加的约束，如果需要重设约束可以使用mas_remakeConstraints
[animateView mas_updateConstraints:^(MASConstraintMaker *make) {
    make.width.mas_equalTo(200);
}]; 

五.总结

总的来说，Masonry还是比原生的NSLayoutConstraint要好用的，毕竟，第三方库的初衷就是简化原生的操作。建议大家可以用一下，不过，了解实现原理会更好。