Masonry是什么？
Masonry是一个轻量级的布局框架，拥有自身的描述性语法，采用更加优雅的链式语法封装了自动布局autolayout，简洁明了，可读性高，并且同时支持iOS和Mac OSXMasonry
Masonry在GitHub
Masonry怎么用?
首先我们看一下官方的示例代码：
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(superview).with.insets(padding);
}];
Masonry的一些属性与NSLayoutAttribute对照
| MASViewAttribute | NSAutoLayout | 说明 |
|---|---|---|
| view.mas_left | NSLayoutAttributeLeft | 左侧 |
| view.mas_right | NSLayoutAttributeRight | 右侧 |
| view.mas_top | NSLayoutAttributeTop | 上侧 |
| view.mas_bottom | NSLayoutAttributeBottom | 下侧 |
| view.mas_leading | NSLayoutAttributeLeading | 首部 |
| view.mas_trailing | NSLayoutAttributeTrailing | 尾部 |
| view.mas_width | NSLayoutAttributeWidth | 宽 |
| view.mas_height | NSLayoutAttributeHeight | 高 |
| view.mas_centerX | NSLayoutAttributeCenterX | 横向中点 |
| view.mas_centerY | NSLayoutAttributeCenterY | 纵向中点 |
| view.mas_baseline | NSLayoutAttributeBaseline | 文本基线 |
举例:
1. 居中显示一个View：
UIView *view1 = [[UIView alloc] init];
view1.backgroundColor = [UIColor redColor];
//2.使用Masonry约束之前，一定要将view加到superView上，否则会报错
[self.view addSubview:view1];
//用masonry函数对你添加的view进行约束
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
// 设置view1居中
make.center.equalTo(self.view);
// 设置view2宽高
make.size.mas_equalTo(CGSizeMake(300, 300));
}];
/**
*1.mas_makeConstraints 只负责添加新增约束，Autolayout中不能同时存在两条针对于同一对象的约束，否则会报错
*2.mas_makeConstraints 针对上面的情况，会更新在block中出现的约束，确保不会出现两个相同的约束
*3.mas_makeConstraints 会清除之前所有的约束，仅保留最新的约束
*/
/**
*mas_equal 除了支持NSNumber的数值类型外，就支持CGPoint CGSize UIEdgeInsets
*/
2.让一个view略小于其superView[边界15];
UIView *view2 = [[UIView alloc] init];
view2.backgroundColor = [UIColor cyanColor];
[self.view addSubview:view2];
[view2 mas_makeConstraints:^(MASConstraintMaker *make) {
//1.第一种布局方法
make.top.equalTo(self.view).with.offset(15);
make.left.equalTo(self.view).with.offset(15);
make.bottom.equalTo(self.view).with.offset(-15);
make.right.equalTo(self.view).with.offset(-15);
//2.第二种
// make.top.left.bottom.and.right.equalTo(self.view).insets(UIEdgeInsetsMake(15, 15, 15, 15));
//3.第三种
// make.edges.equalTo(self.view).with.insets(UIEdgeInsetsMake(15, 15, 15, 15));
}];
3.让两个高度为150 的veiw垂直居中并且等宽等间隔排列 间隔(10) 宽度自动计算
UIView *view3 = [[UIView alloc] init];
view3.backgroundColor = [UIColor purpleColor];
[self.view addSubview:view3];
UIView *view4 = [[UIView alloc] init];
view4.backgroundColor = [UIColor yellowColor];
[self.view addSubview:view4];
[view3 mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerY.mas_equalTo(self.view.mas_centerY);
make.left.equalTo(self.view.mas_left).with.offset(10);
make.right.equalTo(view4.mas_left).with.offset(-10);
make.height.mas_equalTo(@150);
make.width.equalTo(view4);
}];
[view4 mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerY.mas_equalTo(self.view.mas_centerY);
make.left.equalTo(view3.mas_right).with.offset(10);
make.right.equalTo(self.view.mas_right).with.offset(-10);
make.height.equalTo(view3);
make.width.equalTo(view3);
}];
使用Masonry过程中可能出现的错误:
一.错误信息统计（width改为with）
reason: 'Attributes should be chained before defining the constraint relation'
崩溃到masonry内部的方法里面：
崩溃的提示信息：
直接上代码：（这是运行没有问题的代码）
[self.GradientLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.right.equalTo(self.CurrenPriceLabel.mas_right);
make.left.equalTo(self.VariationLabel.mas_left).**with**.offset(30);**／／更改的是此处的width变为with，否则会报错**
make.**width**.equalTo(@60);**／／此处的width不需要改动**
make.height.mas_equalTo(@30);
}];
注意：解决方法将width更改为with即可。并不是全部的width都要改变，注意看上面的代码部分。
二.错误信息统计（父子控件之间的关系没有建立好）
reason：couldn't find a common superview for
解决方法：查－－－好自己做约束的父子控件之间的关系是否建立起来了。
UITextField *nameTextField = [UITextField new];
nameTextField.font = [UIFont systemFontOfSize:14];
nameTextField.placeholder = @"请再次输入密码";
*** //父子控件的建立好关系：self.testView为父控件，nameTextField为子控件***
[self.testView **addSubview**:nameTextField];
***//开始约束***
[lable mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.mas_equalTo(self.testView.mas_left).with.offset(20);
make.top.mas_equalTo(self.testView.mas_top).with.mas_offset(0);
make.height.mas_equalTo(30);
make.width.mas_equalTo(50);
}];
可能出现的错误章节摘于作者 Xcode8