一.前言

之前寫了一篇關于Autoresizing和一篇關于Autolayout的文章，里面對于iOS系統(tǒng)自帶的約束講解的很詳細，所以，這里就不會對此作過多的敘述，要明白一點，就是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);
}];

代碼非常簡潔，易讀，就算不知道實現(xiàn)的原理，也能看的出來，這幾個約束是什么意思，Masonry的強大之處。

三.Masonry實現(xiàn)的原理

1.Masonry包含的所有文件

Masonry版本：1.0.2
-| Masonry    //引入Masonry所有的頭文件
-| MASUtilities    //工具類
-| MASLayoutConstraint    //NSLayoutConstraint的子類，新增了mas_key屬性，和當前的約束關聯(lián)
-| MASConstraint    //創(chuàng)建約束的容器
  -| MASViewConstraint    //單個約束，MASConstraint的子類
  -| MASCompositeConstraint     //包含一個或者多個約束，MASConstraint的子類
-| MASConstraintMaker    //創(chuàng)建約束
-| MASViewAttribute    //主要讓view和約束關聯(lián)起來
-| 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的約束數(shù)組，傳入一個block。
2.block傳入MASConstraintMaker（負責管理兩個View的約束）的實例make。
3.以make.top.equalTo(self.view.mas_top).with.offset(10)為例，make調(diào)用top屬性再調(diào)用mas_equalTo方法，最后調(diào)用offset方法，完成一個約束的設置。這條語句最后會生成一個MASViewConstraint，然后存在MASConstraintMaker的constraints數(shù)組里，等block調(diào)用完畢，則會直接調(diào)用make的install方法。make的install方法里面會遍歷constraints數(shù)組，然后逐條調(diào)用MASViewConstraint的install方法，最后在里面調(diào)用Object-C原生的方法設置兩個View之間的約束。

四.使用Masonry的例子

?? 1.二等分
效果圖：

Masonry實現(xiàn)二等分.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);    
}];

//通過更新約束觸發(fā)動畫
//只能更新已添加的約束，如果需要重設約束可以使用mas_remakeConstraints
[animateView mas_updateConstraints:^(MASConstraintMaker *make) {
    make.width.mas_equalTo(200);
}]; 

五.總結

總的來說，Masonry還是比原生的NSLayoutConstraint要好用的，畢竟，第三方庫的初衷就是簡化原生的操作。建議大家可以用一下，不過，了解實現(xiàn)原理會更好。