Masonry使用的总结

以前使用的自动布局框架总结的东西,也有部分借鉴的东西,如今整理使用的心得!

 

如下是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; //文本基线

 

属性有了,接着咱们应该怎么在视图中添加约束呢，Masonry给咱们提供了3个方法

//新增约束
 - (NSArray *)mas_makeConstraints:(void(^)(MASConstraintMaker *make))block; 

//更新约束
 - (NSArray *)mas_updateConstraints:(void(^)(MASConstraintMaker *make))block;

//清楚以前的全部约束,只会保留最新的约束
 - (NSArray *)mas_remakeConstraints:(void(^)(MASConstraintMaker *make))block;
 
 合理的利用这个3个函数，基本上能够应对任何状况了

准备工做已经完成，咱们来看几个小demo

 

    UIView *view1 = [UIView new];

    view1.backgroundColor = [UIColor redColor];

    [self.view addSubview:view1];

    

    __weak typeof (self)wSelf = self;

    [view1 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.center.equalTo(wSelf.view);

        make.edges.mas_offset(UIEdgeInsetsMake(10, 10, 10, 10));

    }];

    

    

    UIView *sv1 = [UIView new];

    sv1.backgroundColor = [UIColor yellowColor];

    [view1 addSubview:sv1];

    

    [sv1 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.size.mas_equalTo(CGSizeMake(60, 60));

        make.centerX.equalTo(wSelf.view);

        make.top.equalTo(wSelf.view).and.offset(130);

        

    }];

    

    UIView *sv2 = [UIView new];

    sv2.backgroundColor = [UIColor greenColor];

    [view1 addSubview:sv2];

    [sv2 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.size.mas_equalTo(CGSizeMake(100, 100));

        make.centerX.equalTo(sv1);

        make.top.equalTo(sv1.mas_bottom).offset(20);

        

    }];

 

 

    __weak typeof (self)wSelf = self;

    UIView *v1 = [UIView new];

    UIView *v2 = [UIView new];

    UIView *v3 = [UIView new];

    UIView *v4 = [UIView new];

    UIView *v5 = [UIView new];

    v1.backgroundColor = [UIColor redColor];

    v2.backgroundColor = [UIColor redColor];

    v3.backgroundColor = [UIColor redColor];

    v4.backgroundColor = [UIColor redColor];

    v5.backgroundColor = [UIColor redColor];

    [self.view addSubview:v1];

    [self.view addSubview:v2];

    [self.view addSubview:v3];

    [self.view addSubview:v4];

    [self.view addSubview:v5];

    

    [v1 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.size.mas_equalTo(CGSizeMake(40, 40));

        make.top.equalTo(wSelf.view).offset(45);

        make.left.equalTo(wSelf.view).offset(35);

    }];

    

    [v2 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.size.mas_equalTo(CGSizeMake(75, 35));

        make.centerY.equalTo(v1);

        make.left.equalTo(v1.mas_right).offset(35);

    }];

    

    [v3 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.size.mas_equalTo(CGSizeMake(50, 50));

        make.centerY.equalTo(v2);

        make.left.equalTo(v2.mas_right).offset(35);

    }];

    

    [v4 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.top.equalTo(v1.mas_bottom).offset(35);

        make.centerX.equalTo(v1);

        make.size.mas_equalTo(CGSizeMake(30, 30));

    }];

    

    [v5 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.top.equalTo(v4.mas_bottom).offset(35);

        make.centerX.equalTo(v4);

        make.size.mas_equalTo(CGSizeMake(60, 60));

    }];

 

 

    __weak typeof (self)weakSelf = self;

    

    UIView *headView = [UIView new];

    headView.backgroundColor = [UIColor redColor];

    [self.view addSubview:headView];

    

    [headView mas_makeConstraints:^(MASConstraintMaker *make) {

        make.centerX.equalTo(weakSelf.view);

        make.top.equalTo(weakSelf.view).offset(70);

        make.size.mas_equalTo(CGSizeMake(200, 200));

    }];

    

    UILabel *lbl = [UILabel new];

    lbl.text = @"大伙儿都叫我浩哥";

    [self.view addSubview:lbl];

    

    [lbl mas_makeConstraints:^(MASConstraintMaker *make) {

        make.centerX.equalTo(headView);

        make.top.equalTo(headView.mas_bottom).offset(10);

    }];

    

    UITextField *field = [UITextField new];

    [field setPlaceholder:@"那就叫我浩哥吧"];

    //    field.backgroundColor = [UIColor lightGrayColor];

    [self.view addSubview:field];

    

    [field mas_makeConstraints:^(MASConstraintMaker *make) {

        make.top.equalTo(lbl.mas_bottom).offset(10);

        make.left.equalTo(weakSelf.view).offset(40);

        make.right.equalTo(weakSelf.view).offset(-40);

    }];

    

    UILabel *lbl1 = [UILabel new];

    lbl1.text = @"选择标签:";

    [self.view addSubview:lbl1];

    [lbl1 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.left.equalTo(weakSelf.view).offset(40);

        make.top.equalTo(field.mas_bottom).offset(10);

    }];

    

    UITextField *field1 = [UITextField new];

    [field1 setPlaceholder:@"浩哥浩哥"];

    //    field.backgroundColor = [UIColor lightGrayColor];

    [self.view addSubview:field1];

    

    [field1 mas_makeConstraints:^(MASConstraintMaker *make) {

        make.left.equalTo(lbl1.mas_right).offset(10);

        make.right.equalTo(weakSelf.view).offset(40);

        make.centerY.equalTo(lbl1);

    }];

 

 

目前先总结到这里,之后在补充!