一、先做一个比较
- 使用系统自带的方法
UIView *superview = self.view;
//创建一个 view1
UIView *view1 = [[UIView alloc] init];
view1.translatesAutoresizingMaskIntoConstraints = NO;
view1.backgroundColor = [UIColor greenColor];
[superview addSubview:view1];
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[superview addConstraints:@[
//view1 constraints
[NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:padding.top],
[NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeLeft
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeLeft
multiplier:1.0
constant:padding.left],
[NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:-padding.bottom],
[NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeRight
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeRight
multiplier:1
constant:-padding.right]
]];
- 使用 masonry 实现同样效果,代码进行比较:
- 第一种方法:
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(superview.mas_top).with.offset(padding.top); //with is an optional semantic filler
make.left.equalTo(superview.mas_left).with.offset(padding.left);
make.bottom.equalTo(superview.mas_bottom).with.offset(-padding.bottom);
make.right.equalTo(superview.mas_right).with.offset(-padding.right);
}];
- 第二种方法:
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(superview).with.insets(padding);
}];
二、masonry 的简单使用
2.1.创建一个 size 为 (100,100) 大小,位置位于右下角的 view:
- 首先创建一个 view:yellow
UIView *yellow = [[UIView alloc]init];
yellow.backgroundColor = [UIColor yellowColor];
yellow.backgroundColor = [UIColor cyanColor];
[self.view addSubview:yellow];
注:创建完 view 控件之后就要加入父控件中,因为添加约束时候会参照父控件进行约束,如果不这样做运行时就会在约束处报错。
- 添加约束方法一:
[yellow mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.mas_equalTo(CGSizeMake(100, 100));
make.bottom.mas_equalTo(self.view).offset(-20);
make.right.mas_equalTo(self.view.mas_right).offset(-20);
}];
- 添加约束方法二:
[yellow mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.mas_equalTo(CGSizeMake(100, 100));
make.bottom.offset(-20);
make.right.mas_equalTo(self.view).offset(-20);
}];
- 添加约束方法三:
[yellow mas_makeConstraints:^(MASConstraintMaker *make) {
make.width.equalTo(@(100));
make.height.mas_equalTo(100);
make.right.offset(-20);
make.bottom.mas_equalTo(self.view).offset(-20);
}];
总结:①方法一和方法二所添加约束代码有所不同,通过仔细观察可以发现以下三句代码所起作用一样,系统会根据 make. 后面的关键词进行自动匹配后面的内容:
make.bottom.mas_equalTo(self.view.mas_bottom).offset(-20);
make.bottom.mas_equalTo(self.view).offset(-20);
make.bottom.offset(-20);
- 如果后面有 mas_equalTo 就进行匹配;
- 如果句中没有 mas_equalTo 就会自动添加和 make. 后面的关键词对应的约束。
②方法三种 make.width.equalTo(@(100)) 的 make.width.equalTo 中传入的参数要是 id 类型的,所以必须要对基本数据类型进行封装;而 make.height.width.mas_equalTo(100) 中的 mas_equalTo 会对传入的参数进行自动封装,所以对传入的参数可以不封装。
2.2.创建一个大小为父控件大小 0.3 倍的控件,并居中显示:
- 方法一:
[yellow mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.equalTo(self.view).multipliedBy(0.3);
make.centerX.mas_equalTo(self.view.mas_centerX);
make.centerY.mas_equalTo(self.view.mas_centerY);
}];
以上约束 X 和 Y 的语句中,都可以再进行更改,例如把 mas_equalTo(self.view.mas_centerY) 改成 mas_equalTo(self.view),效果一样。
- 方法二:
[yellow mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.equalTo(self.view).multipliedBy(0.3);
make.center.mas_equalTo(self.view.center);
}];
同样:以上代码中的 mas_equalTo(self.view.center) 可以把参数中的 **.center **去掉。
三、总结:
- 一般的项目都很少使用系统提供的自动布局方法,转而使用 masonry 第三方框架;
- mas_equalTo 和 equalTo 比较:
- mas_equalTo:这个方法会对参数进行包装;
- equalTo:这个方法不会对参数进行包装;
- mas_equalTo 的功能强于 equalTo 。
- 优化 mas_
- 加入下面这句代码** #define MAS_SHORTHAND** ,在所有地方都可以把 mas_ 去掉,但是此句必须要加在 **#import "本类类名"; ** 之前(即导入本类头文件之前);
- 但是有些 mas_ 不能去掉,比如:make.width.mas_equalTo(100);必须要进行包装,此时在 #import "本类类名" 之前加入以下一句即可:#define MAS_SHORTHAND_GLOBALS
- 建议:
- 在不确定的时候,所有地方都使用带有 mas_ 的关键字;
- 在文件中引入 ** #define MAS_SHORTHAND** 和 #define MAS_SHORTHAND_GLOBALS 之后,就不需要在考虑任何 mas_ 。
- 约束的类型:
- 尺寸:width/height/size
- 边界:left/leading/right/trailing/top/bottom
- 中心的:center/centerX/centerY
- 边界:edges
总之,masonry 的语法很灵活,勤加练习,找到规律,使用起来就会觉得很轻松了 O(∩_∩)O
网友评论