参考文档0
参考文档1
参考文档2
参考文档3
参考文档4
参考文档5
参考文档6
Maonry 代码约束使用比较简单,是对系统原生自动约束的封装，以下只罗列一些核心的三个方法和基本使用。相比SDAutoLayout有很多类似地方，各有所长。
Tips:
mas_equalTo自动将20自动包装为@20
equalTo则没有自动包装
如果#define MAS_SHORTHAND_GLOBALS
则两者没差别width 表示make对象的一个属性，用来添加宽度结束
mas_width 是一个属性值，作为equalTo的参数表示控件宽度属性
如果#define MAS_SHORTHAND
则两者没差别
但不建议添加view.mas_left view.left 容易和工程中其它分类冲突以上两个宏定义要写在导入头文件之前
with 和 and 只是为提高代码可读性，可有可无
先添加到父视图再添加代码约束
__weak typeof(self) weakSelf = self;(完全没必要,因为并未相互持有，所以不会循环引用）
tableViewCell 在拉约束时，父视图是self.contentView
基本方法
[view remakeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view).insets(UIEdgeInsetsMake(100, 100, 100, 100));
}];
//新增约束
- (NSArray *)mas_makeConstraints:(void(^)(MASConstraintMaker *make))block;
//更新约束
- (NSArray *)mas_updateConstraints:(void(^)(MASConstraintMaker *make))block;
//清除之前的所有约束,只会保留最新的约束
- (NSArray *)mas_remakeConstraints:(void(^)(MASConstraintMaker *make))block;
//添加约束
[view0 mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.top.equalTo(50);//默认相对父视图
make.width.equalTo(self.view).offset(-100);
make.bottom.equalTo(self.view).offset(-200);
}];
//更新约束
[view0 updateConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(10);
}];
//删除之前的约束，重新添加约束
[view0 remakeConstraints:^(MASConstraintMaker *make) {
self.constraint = make.top.equalTo(30);
make.left.equalTo(40);
make.width.height.equalTo(self.view).multipliedBy(0.3);
}];
改变约束
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
//第一种
self.constraint.equalTo(100);
//约束立即生效
[self.view layoutIfNeeded];
//第二种
//约束带动画生效
self.constraint.equalTo(200);
[UIView animateWithDuration:2
animations:^{
[self.view layoutIfNeeded];
}];
//取消或使用约束
[heightConstraint uninstall];
[heightConstraint install];
}
特别注意更新约束是相对于同一参照物而言的，如果是不同参照物刚更改会认为是新加约束。为避免这种冲突可以在通过修改约束的优先级来解决
[self.imgView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(@10).priorityMedium();
make.left.equalTo(@10);
make.width.height.equalTo(@300);
}];
//更改约束
[self.imgView mas_updateConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.label.mas_bottom);
}];
约束类型
/**
1.尺寸：width、height、size
2.边界：left、leading、right、trailing、top、bottom
3.中心点：center、centerX、centerY
4.边界：edges
5.偏移量：offset、insets、sizeOffset、centerOffset
6.priority()约束优先级（0~1000），multipler乘因数, dividedBy除因数
*/
Label多行约束
// Content - 多行
// 计算UILabel的preferredMaxLayoutWidth值，
// 多行时必须设置这个值，否则系统无法决定Label的宽度
// 44 = avatar宽度，4 * 3为padding
CGFloat preferredMaxWidth =
[UIScreen mainScreen].bounds.size.width - 44 - 4 * 3;
_contentLabel = [UILabel new];
_contentLabel.numberOfLines = 0;
#Pragma ********** 多行时必须设置**********
_contentLabel.preferredMaxLayoutWidth = preferredMaxWidth;
[self.contentView addSubview:_contentLabel];
[_contentLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(_titleLabel.mas_bottom).with.offset(4);
make.left.equalTo(_avatarImageView.mas_right).with.offset(4);
make.right.equalTo(self.contentView).with.offset(-4);
make.bottom.equalTo(self.contentView).with.offset(-4);
}];
居中约束
UIView *supView = [UIView new];
supView.backgroundColor = [UIColor redColor];
[self.view addSubview:supView];
UIView *leftView = [UIView new];
leftView.backgroundColor = [UIColor orangeColor];
[supView addSubview:leftView];
UIView *rightView = [UIView new];
rightView.backgroundColor = [UIColor greenColor];
[supView addSubview:rightView];
[supView mas_makeConstraints:^(MASConstraintMaker *make) {
******superView只居中，尺寸自动扩展******
//不设置宽度高度，内部自己设置
make.center.equalTo(self.view);//设置父视图居中
}];
[leftView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.top.bottom.equalTo(supView);//设置上左下对齐父视图
make.size.equalTo(CGSizeMake(80, 40));//设置尺寸
make.right.equalTo(rightView.mas_left).offset(-10);//设置间距
}];
[rightView mas_makeConstraints:^(MASConstraintMaker *make) {
make.right.top.bottom.equalTo(supView);//设置右上下对齐父视图 (配合leftView就可以确定superView的宽高了)
make.size.equalTo(leftView);
}];
参考配置
数组添加约束
for (int i = 0; i< 5; i++) {
UIView *view = [UIView new];
view.backgroundColor = [UIColor greenColor];
[self.view addSubview:view];
[self.arr addObject:view];
}
//方法要求数组中只存在UIView,且有共同的superView.
//水平方向控件间隔固定(等间隔)
[self.arr mas_distributeViewsAlongAxis:MASAxisTypeHorizontal
withFixedSpacing:10
leadSpacing:10
tailSpacing:10];
[self.arr makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(100);
make.height.equalTo(100);
}];
//水平方向控件宽度固定(等宽度)
[self.arr mas_distributeViewsAlongAxis:MASAxisTypeHorizontal
withFixedItemLength:10
leadSpacing:10
tailSpacing:10];
[self.arr makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(100);
make.height.equalTo(100);
}];
UIScrollView
UIScrollView *scrollView = [UIScrollView new];
scrollView.backgroundColor = [UIColor grayColor];
[self.view addSubview:scrollView];
[scrollView makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view);
}];
UIView *contentView = [UIView new];
[scrollView addSubview:contentView];
UIView *lastView;
for (int i = 0; i<15; i++) {
UIView *view = [UIView new];
view.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:1.0];
[contentView addSubview:view];
[view makeConstraints:^(MASConstraintMaker *make) {
//三目运算
make.top.equalTo(lastView?lastView.bottom:@0);
make.left.equalTo(0);
make.width.equalTo(contentView.width);
make.height.equalTo(30);
}];
lastView = view;
}
//
//和在XIB 中设置完全一样，需要设置edges+宽度和高度，或edges+宽度和下沿才完整。
//
[contentView makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(scrollView);//边界紧巾贴scrollView
make.width.equalTo(scrollView);//跟scrollView等宽
make.bottom.equalTo(lastView.bottom);
}];
优先级
Content Compression Resistance 挤压阻力 <=>“不许挤我”
当空间不够时，优先级priority 越高越不容易被挤压，显示越完整。
Content Hugging = “抱紧”
当空间扩大时，优先级越高越不容易扩大。
// label1: 位于左上角
[_label1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(_contentView1.mas_top).with.offset(5);
make.left.equalTo(_contentView1.mas_left).with.offset(2);
// 40高度
make.height.equalTo(@40);
}];
// label2: 位于右上角
[_label2 mas_makeConstraints:^(MASConstraintMaker *make) {
//左边贴着label1，间隔2
make.left.equalTo(_label1.mas_right).with.offset(2);
//上边贴着父view，间隔5
make.top.equalTo(_contentView1.mas_top).with.offset(5);
//右边的间隔保持大于等于2，注意是lessThanOrEqual
//这里的“lessThanOrEqualTo”放在从左往右的X轴上考虑会更好理解。
//即：label2的右边界的X坐标值“小于等于”containView的右边界的X坐标值。
make.right.lessThanOrEqualTo(_contentView1.mas_right).with.offset(-2);
//只设置高度40
make.height.equalTo(@40);
}];
*******注意*******
//先设置显示内容，都可以显示
//设置label1的content hugging 为1000
[_label1 setContentHuggingPriority:UILayoutPriorityRequired
forAxis:UILayoutConstraintAxisHorizontal];
//设置右边的label2的content hugging 为1000
[_label2 setContentHuggingPriority:UILayoutPriorityRequired
forAxis:UILayoutConstraintAxisHorizontal];
//再设置是否压缩
//设置label1的content compression 为1000
[_label1 setContentCompressionResistancePriority:UILayoutPriorityRequired
forAxis:UILayoutConstraintAxisHorizontal];
//设置右边的label2的content compression 为250
[_label2 setContentCompressionResistancePriority:UILayoutPriorityDefaultLow
forAxis:UILayoutConstraintAxisHorizontal];
topLayutGuide 和 bottomLayoutGuide
topLayoutGuide表示当前页面的上方被status bar、navigation bar遮挡的部分。同理，bottomLayoutGuide表示下方被遮挡的部分。
[_topView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.mas_topLayoutGuide);
// ...
}];
自定义baseline
对于自定义的View默认基线就时整个View的底部，当然也可以自定义，只要重写方法即可。
[item1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.mas_equalTo(self.view.mas_left).with.offset(8);
make.top.mas_equalTo(self.view.mas_top).with.offset(200);
}];
// 跟第一个item的baseline对其
[item2 mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.mas_equalTo(item1.mas_right).with.offset(10);
make.baseline.mas_equalTo(item1.mas_baseline);
}];
// 跟第一个item的baseline对其
[item3 mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.mas_equalTo(item2.mas_right).with.offset(10);
make.baseline.mas_equalTo(item1.mas_baseline);
}];
// 在自定义的item类中
// 返回自定义的baseline的view
- (UIView *)viewForBaselineLayout {
return _imageView;
}