首页 > 代码库 > 【原】iOS学习之Masonry第三方约束

【原】iOS学习之Masonry第三方约束

1、Masonry概述

  • 目前最流行的Autolayout第三方框架

  用优雅的代码方式编写Autolayout

  省去了苹果官方恶心的Autolayout代码

  大大提高了开发效率

  •  框架地址:https://github.com/SnapKit/Masonry

2、常用方法

  • 这个方法只会添加新的约束
[blueView mas_makeConstraints:^(MASConstraintMaker *make) {}];
  • 这个方法会将以前的所有约束删掉,添加新的约束    
[blueView mas_remakeConstraints:^(MASConstraintMaker *make) {       }];
  • 这个方法将会覆盖以前的某些特定的约束     
[blueView mas_updateConstraints:^(MASConstraintMaker *make) {       }]; 

3、约束类型

  • 尺寸:

  width(宽)\height(高)\size(大小)

        // 宽度约束        make.width.mas_equalTo(100);        // 高度约束        make.height.mas_equalTo(100);                //  大小约束(与上面两句等价)        make.size.mas_equalTo(CGSizeMake(100, 100));
  • 边界:

  left\leading(左边界)\right\trailing(右边界)\top(顶部边界)\bottom(底部边界)  

       // 左边(leading类似)        make.left.mas_equalTo(self.view).offset(50);        // 右边(trailing类似)        make.right.equalTo(self.view).offset(-20);        // 顶部        make.top.equalTo(self.view).offset(20);        // 底部        make.bottom.mas_equalTo(self.view).offset(-50);
  • 中心点:

  center\centerX\centerY

    // 居中(水平+垂直)    // 尺寸是父控件的一半    [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);    }];
  • 内边距实现边界约束:

  edges

// UIEdgeInsets 内边距make.edges.mas_equalTo(self.view).insets(UIEdgeInsetsMake(50, 50, 50, 50));

4、mas_前缀修饰与不修饰的区别    

  • mas_equalTo和equalTo

  默认情况下:

   mas_equalTo有自动包装功能,比如自动将20包装为@20

   equalTo没有自动包装功能

  mas_equalTo的功能强于 > equalTo,可以一直使用mas_equalTo

  • mas_width和width

  默认情况下: 

   width是make对象的一个属性,用来添加宽度约束用的,表示对宽度进行约束 

   mas_width是一个属性值,用来当做equalTo的参数,表示某个控件的宽度属性

  mas_height、mas_centerX以此类推

  • 消除区别办法

  如果添加了下面的宏,那么 mas_equalTo 和 equalTo 就没有区别

  #define MAS_SHORTHAND_GLOBALS // 注意:这个宏一定要添加到#import "Masonry.h"前面

  如果添加了下面的宏,mas_width也可以写成width

  #define MAS_SHORTHAND

//define this constant if you want to use Masonry without the ‘mas_‘ prefix#define MAS_SHORTHAND//define this constant if you want to enable auto-boxing for default syntax#define MAS_SHORTHAND_GLOBALS#import "Masonry.h" - (void)viewDidLoad {    [super viewDidLoad];       // 蓝色控件    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);    }];} 

5、可有可无的用法

  以下方法都仅仅是为了提高可读性,可有可无

  • with
- (MASConstraint*)with {    return self;}   
  使用情况示例代码
  // 尺寸限制:100x100  // 位置:粘着父控件右下角,间距是20  [blueView mas_makeConstraints:^(MASConstraintMaker *make) {      // 宽度约束      make.width.equalTo(@100);      // 高度约束      make.height.equalTo(@100);      // 右边      make.right.equalTo(self.view.mas_right).with.offset(-20);      // 顶部      make.top.equalTo(self.view.mas_top).with.offset(20);  }];
  •  and
- (MASConstraint*)and {    return self;}

  使用情况示例代码

    // 尺寸限制:100x100    // 位置:粘着父控件右下角,间距是20        [blueView mas_makeConstraints:^(MASConstraintMaker *make) {        // 宽度高度约束        make.width.and.height.mas_equalTo(100);        // 右边        make.right.equalTo(self.view).offset(-20);        // 顶部        make.top.equalTo(self.view).offset(20);            }];

 

【原】iOS学习之Masonry第三方约束