8.Masonry的使用方法

Masonry

• 使用步骤

  • 添加Masonry文件夹的所有源代码到项目中
  • 添加2个宏、导入主头文件
    

    只要添加了这个宏'#define MAS_SHORTHAND'，就不用带mas_前缀只要添加了这个宏 '#define MAS_SHORTHAND_GLOBALS'，equalTo就等价于mas_equalTo这个头文件一定要放在上面两个宏的后面import "Masonry.h"

• 添加约束的方法

  // 这个方法只会添加新的约束[view makeConstraints:^(MASConstraintMaker *make) {}];//这个方法会将以前的所有约束删掉，添加新的约束[view remakeConstraints:^(MASConstraintMaker *make) {}];// 这个方法将会覆盖以前的某些特定的约束[view updateConstraints:^(MASConstraintMaker *make) {}];

• 约束的类型

  1.尺寸：width\height\size2.边界:left\leading\right\trailing\top\bottom3.中心点：center\centerX\centerY4.边界：edges

• 使用实例

  • 设置View粘着父控件右下角，间距是20

     // 蓝色控件UIView *blueView = [[UIView alloc] init];blueView.backgroundColor = [UIColor blueColor];[self.view addSubview:blueView];// 尺寸限制：100x100// 位置：粘着父控件右下角，间距是20// 这个方法只会添加新的约束// 1. [blueView mas_makeConstraints:^(MASConstraintMaker *make) {// 宽度约束//        make.width.equalTo(@100);//        // 高度约束//        make.height.equalTo(@100);//        // 右边//        make.right.equalTo(self.view.mas_right).offset(-20);//        // 顶部//        make.top.equalTo(self.view.mas_top).offset(20);//    }];//2.    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        // 宽度约束//        make.width.mas_equalTo(100);//        // 高度约束//        make.height.mas_equalTo(100);//        // 右边//        make.right.equalTo(self.view).offset(-20);//        // 顶部//        make.top.equalTo(self.view).offset(20);//    }];//3.    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        // 宽度高度约束//        make.width.height.mas_equalTo(100);//        // 右边//        make.right.equalTo(self.view).offset(-20);//        // 顶部//        make.top.equalTo(self.view).offset(20);//    }];//3.    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        // 宽度高度约束////        make.size.equalTo([NSValue valueWithCGSize:CGSizeMake(100, 100)]);////        make.size.mas_equalTo(CGSizeMake(100, 100));//        make.size.mas_equalTo(100);//        // 右边//        make.right.equalTo(self.view).offset(-20);//        // 顶部//        make.top.equalTo(self.view).offset(20);//    }];4.   [blueView mas_makeConstraints:^(MASConstraintMaker *make) {    // 宽度高度约束    make.height.mas_equalTo(self.view).multipliedBy(0.5).offset(-50);    // 右边    make.right.mas_equalTo(self.view).offset(-20);    //        make.right.offset(-20);    // 顶部    make.top.mas_equalTo(self.view).offset(20);    //        make.top.offset(20);}];/** mas_equalTo：这个方法会对参数进行包装 equalTo：这个方法不会对参数进行包装 mas_equalTo的功能强于 > equalTo */

  • 设置View居中

         // 蓝色控件UIView *blueView = [[UIView alloc] init];blueView.backgroundColor = [UIColor blueColor];[self.view addSubview:blueView];// 居中（水平+垂直）// 尺寸是父控件的一半[blueView mas_makeConstraints:^(MASConstraintMaker *make) {    make.size.mas_equalTo(self.view).multipliedBy(0.5);    make.center.mas_equalTo(self.view);    //        make.centerX.mas_equalTo(self.view);    //        make.centerY.mas_equalTo(self.view);}];

  • 设置View距离四周50间距

        // 蓝色控件UIView *blueView = [[UIView alloc] init];blueView.backgroundColor = [UIColor blueColor];[self.view addSubview:blueView];// 距离父控件四周都是50间距//1.    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        make.left.mas_equalTo(self.view.mas_left).offset(50);//        make.right.mas_equalTo(self.view.mas_right).offset(-50);//        make.top.mas_equalTo(self.view.mas_top).offset(50);//        make.bottom.mas_equalTo(self.view.mas_bottom).offset(-50);//    }];//2.    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        make.left.mas_equalTo(self.view).offset(50);//        make.right.mas_equalTo(self.view).offset(-50);//        make.top.mas_equalTo(self.view).offset(50);//        make.bottom.mas_equalTo(self.view).offset(-50);//    }];// 3.   [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        make.left.offset(50);//        make.right.offset(-50);//        make.top.offset(50);//        make.bottom.offset(-50);//    }];//4.    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {//        make.left.top.offset(50);//        make.right.bottom.offset(-50);//    }];5. [blueView mas_makeConstraints:^(MASConstraintMaker *make) {    //        make.edges.mas_equalTo(self.view).insets(UIEdgeInsetsMake(50, 50, 50, 50));    make.center.mas_equalTo(self.view).insets(UIEdgeInsetsZero);}];

  • 设置两个View间距处理

        // 蓝色控件UIView *blueView = [[UIView alloc] init];blueView.backgroundColor = [UIColor blueColor];[self.view addSubview:blueView];// 红色控件UIView *redView = [[UIView alloc] init];redView.backgroundColor = [UIColor redColor];[self.view addSubview:redView];CGFloat margin = 20;CGFloat height = 50;[blueView makeConstraints:^(MASConstraintMaker *make) {    make.left.equalTo(self.view.left).offset(margin);    make.right.equalTo(redView.left).offset(-margin);    make.bottom.equalTo(self.view.bottom).offset(-margin);    make.height.equalTo(height);    make.top.equalTo(redView.top);    make.bottom.equalTo(redView.bottom);    make.width.equalTo(redView.width);}];[redView makeConstraints:^(MASConstraintMaker *make) {    make.right.equalTo(self.view.right).offset(-margin);}];