自動佈局之masonry

網上查找的資料，自己記錄一下

masonry 下載地址

 https://github.com/SnapKit/Masonry

添加自動佈局  ，裏面必須知道控件的寬高，或者相對於其他控件的位置

1、

上左爲正 下右爲負 是因爲座標而來的 視圖座標左上爲原點 X向右爲正 Y向下爲正

2、方法

mas_makeConstraints 只負責添加約束 AutoLayout不能同時存在兩條針對同一對象的約束否則會報錯 * mas_updateConstraints 針對上面的情況 會更新在block中出現的約束 不會導致出現兩個相同約束的情況 * mas_remakeConstraints 清除之前所有的約束只保留新的約束

* * 三種函數要配合使用 */

(NSArray )mas_makeConstraints:(void(^)(MASConstraintMaker ))block;

(NSArray )mas_updateConstraints:(void(^)(MASConstraintMaker ))block;

(NSArray )mas_remakeConstraints:(void(^)(MASConstraintMaker make))block;

3、Masonry屬性

@property (nonatomic, strong, readonly) MASConstraint left;
@property (nonatomic, strong, readonly) MASConstraint top;
@property (nonatomic, strong, readonly) MASConstraint right;
@property (nonatomic, strong, readonly) MASConstraint bottom;
@property (nonatomic, strong, readonly) MASConstraint leading;
@property (nonatomic, strong, readonly) MASConstraint trailing;
@property (nonatomic, strong, readonly) MASConstraint width;
@property (nonatomic, strong, readonly) MASConstraint height;
@property (nonatomic, strong, readonly) MASConstraint centerX;
@property (nonatomic, strong, readonly) MASConstraint centerY;
@property (nonatomic, strong, readonly) MASConstraint *baseline;

4、

size 相同

make.size.mas_equalTo(self.view).offset(-20);

5、

居中

 make.centerX.equalTo(self.view.mas_centerX);
 make.centerY.equalTo(self.view.mas_centerY);

等同於：

make.center.mas_equalTo(self.view);

6、

make.size.equalTo(secondview);兩個view就相同大小

等同於

make.width.equalTo(green.mas_width);
make.height.equalTo(green.mas_height);

7、更新約束

初始時約束

[_textField mas_makeConstraints:^(MASConstraintMaker *make) { make.size.mas_equalTo(CGSizeMake(200, 30)); make.bottom.mas_equalTo(-40); make.centerX.equalTo(weakSelf.view.mas_centerX); }];

鍵盤彈出在消息方法裏更新約束：

-(void)keyBoardWillShow:(NSNotification*)noti {
    // 獲取鍵盤基本信息（動畫時長與鍵盤高度）
    NSDictionary *userInfo = [noti userInfo];
    CGRect rect =
    [userInfo[UIKeyboardFrameBeginUserInfoKey] CGRectValue];

    CGFloat keyboardHeight = CGRectGetHeight(rect);
    CGFloat keyboardDuration =
    [userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];

    // 修改下邊距約束
    [_textField mas_updateConstraints:^(MASConstraintMaker *make) {
        make.bottom.mas_equalTo(-keyboardHeight);
    }];

    // 更新約束

    [UIView animateWithDuration:keyboardDuration animations:^{
        [self.view layoutIfNeeded];
    }];

}

鍵盤收起時在textField代理方法中再次更新約束

-(void)keyboardWillDisappear:(NSNotification *)noti {
    // 獲取鍵盤基本信息（動畫時長與鍵盤高度）
    NSDictionary *userInfo = [noti userInfo];
    CGRect rect =
    [userInfo[UIKeyboardFrameBeginUserInfoKey] CGRectValue];

//    CGFloat keyboardHeight = CGRectGetHeight(rect);
    CGFloat keyboardDuration =[userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];

    [_textField mas_updateConstraints:^(MASConstraintMaker *make) {
        make.bottom.mas_equalTo(-40);
    }];
    [UIView animateWithDuration:keyboardDuration animations:^{
        [self.view layoutIfNeeded];
    }];

}

8、例子   上左爲正  下右爲負 必須在某個約束裏面添加  控件的寬高

 UIView *greenView = [UIView new];
    greenView.backgroundColor = [UIColor greenColor];
    greenView.layer.borderWidth = 2;
    greenView.layer.borderColor = [[UIColor blackColor]CGColor];
    [self.view addSubview:greenView];
   
   
    UIView *redView = [UIView new];
    redView.backgroundColor = [UIColor redColor];
    redView.layer.borderWidth =2;
    redView.layer.borderColor = [[UIColor blackColor]CGColor];
    [self.view addSubview:redView];
   
    UIView *blueView = [UIView new];
    blueView.backgroundColor = [UIColor blueColor];
    blueView.layer.borderWidth = 2;
    blueView.layer.borderColor = [[UIColor blackColor]CGColor];
    [self.view addSubview:blueView];

    

    CGFloat padding = 10;
   
    [greenView mas_makeConstraints:^(MASConstraintMaker *make) {
       
        make.top.mas_equalTo(padding);
        make.left.mas_equalTo(padding);
        make.right.mas_equalTo(redView.mas_left).offset(-padding);
        make.bottom.mas_equalTo(blueView.mas_top).offset(-padding);

        //3個控件等高

        make.height.mas_equalTo(@[redView,blueView]);//*******

        //紅，綠 等寬
        make.width.mas_equalTo(redView);//**************
    }];
   
   
    [redView mas_makeConstraints:^(MASConstraintMaker *make) {
       
        make.top.height.bottom.mas_equalTo(greenView);
        make.right.mas_equalTo(-padding);
        make.left.mas_equalTo(greenView.mas_right).offset(padding);
       
    }];
   
    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
       
        make.height.mas_equalTo(greenView);
        make.bottom.mas_equalTo(-padding);
        make.left.mas_equalTo(padding);
        make.right.mas_equalTo(-padding);
   

    }];