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);
}];
网友评论