這個第三方還是比較好用的，當然你也可以使用XIB，但是在有些場景下，Masonry更為好用，比如說此時你創(chuàng)建的視圖并不是全局屬性，或者是所添加的視圖是在某些情況下才會創(chuàng)建，也就是說這個視圖是局部變量，而此時用XIB就很牽強了。所以，Masonry這時候就果斷的站出來了，他可以直接進行局部變量的布局，而且布局思路和XIB的約束也是有些類似，但是他是純代碼哦，也比較好懂，用的是鏈式的簡單語言。這里要注意的是 語句中的and 和 with 實際上時無意義的，只是便于我們去理解代碼的意思。說了這么多，直接來代碼給你們解釋Zzzz

我也是慢慢的學習，所以這篇文章還會一直補充，希望不要斷了。。。。

我就直接上代碼了，不解釋太多了，代碼里面有很多注釋，還是比較詳細的。

這個代碼是直接寫在控制器的ViewDidLoad方法里面的

說下我遇到的大坑吧，就是在設置布局的時候，一定要進行添加，其實添加到哪個視圖上影響的只是視圖的層次關系，并不是他的布局，具體的布局還是要看 make.edges.equalTo(view1) 這句，這里是將布局的相對對象設置成view1了

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    
    
#pragma mark ---- 一個視圖在另一個視圖上的布局 -----
    
    UIView *view1 = [UIView new];
    view1.backgroundColor = [UIColor redColor];
    
    // 要有一個父視圖
    [self.view addSubview:view1];
    
    [view1 mas_makeConstraints:^(MASConstraintMaker *make) {
        // 將圖形設置居中（在self.view）中
        make.center.equalTo(self.view);
        
        // 設置尺寸
        make.size.mas_equalTo(CGSizeMake(350, 350));
        
    }];
//
    
    UIView *view2 = [[UIView alloc] init];
    view2.backgroundColor = [UIColor cyanColor];
    
     // 要有一個父視圖，這個只是圖層的關系，布局還是和make.edges.equalTo(view1) 對象有關
    [view1 addSubview:view2];
    [view2 mas_makeConstraints:^(MASConstraintMaker *make) {
        
        // 這里的make 就相當于調用對象view2
        // equalTo（對象）, 這里指的是相對布局對象
        // 注意這里是with 是一種鏈式的自然語言
        // 上左下右
        make.edges.equalTo(view1).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));
        
        // 可以看到 edges 其實就是top,left,bottom,right的一個簡化 分開寫也可以 一句話更省事
        
         // 等價于
       make.top.equalTo(view1).with.offset(10);
       make.left.equalTo(view1).with.offset(10);
       make.bottom.equalTo(view1).with.offset(-10);
       make.right.equalTo(view1).with.offset(-10);
     
        // 那么為什么bottom和right里的offset是負數(shù)呢? 因為這里計算的是絕對的數(shù)值 計算的bottom需要小于view1的底部高度 所以要-10 同理用于right
        
        
        // 也等價于
  //make.top.left.bottom.and.right.equalTo(view1).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));
    }];
     
    
  
    
//    - (NSArray *)mas_makeConstraints:(void(^)(MASConstraintMaker *make))block;
//    - (NSArray *)mas_updateConstraints:(void(^)(MASConstraintMaker *make))block;
//    - (NSArray *)mas_remakeConstraints:(void(^)(MASConstraintMaker *make))block;
    
     
     //mas_makeConstraints 只負責新增約束 Autolayout不能同時存在兩條針對于同一對象的約束 否則會報錯
     //mas_updateConstraints 針對上面的情況 會更新在block中出現(xiàn)的約束 不會導致出現(xiàn)兩個相同約束的情況
     //mas_remakeConstraints 則會清除之前的所有約束 僅保留最新的約束
    // 三種函數(shù)善加利用 就可以應對各種情況了
     
     
    

  
    
    
    
    
    
#pragma mark ---- 兩個視圖在另一個視圖上的布局，自動調整適應 -----
    
    UIView *view3 = [[UIView alloc] init];
    UIView *view4 = [[UIView alloc] init];
    
    view3.backgroundColor = [UIColor yellowColor];
    view4.backgroundColor = [UIColor yellowColor];
    
    // 要有一個父視圖
    [view1 addSubview:view3];
    [view1 addSubview:view4];
    // 設置距離的變量
    int padding = 10;
    // 先對view3布局
    [view3 mas_makeConstraints:^(MASConstraintMaker *make) {
       
        // 這里只是兩個視圖在同一條水平線上，所以不用center.X
        make.centerY.mas_equalTo(view1.mas_centerY);
        // 這里是相對布局，不需要設置距離底端和上端的距離，直接設置高度
//        make.top.equalTo(self.view.mas_top).offset(padding);
//  make.bottom.equalTo(self.view.mas_bottom).with.offset(- padding);
        make.left.equalTo(view1.mas_left).with.offset(padding);
        
        
        make.right.equalTo(view4.mas_left).with.offset(- padding);
        
        // 設置高度的數(shù)值
        // mas_equalTo 用來設置數(shù)值
        // equalTo 是直接等于某個對象的數(shù)值
        make.height.mas_equalTo(150);
        
        // 設置和view4等寬
        make.width.equalTo(view4);
        
        
        
        
    }];
    
    [view4 mas_makeConstraints:^(MASConstraintMaker *make) {
        
        make.centerY.mas_equalTo(view1.mas_centerY);
        make.left.equalTo(view3.mas_right).with.offset(padding);
        make.right.equalTo(view1.mas_right).with.offset(- padding);
        
        make.height.mas_equalTo(150);
        make.width.equalTo(view3);
        
        
    }];
    

貼張最后效果圖，視圖從最下到上一次是view1，view2，view3 +view4

A9CE0A9D-0339-4C83-8510-42FFE94AE962.png

OK 就到這里，我看明天有沒有空繼續(xù)補充吧，不定時補充~~~~
未完待續(xù)~~~~~~~~~