本文为大地瓜原创,欢迎知识共享,转载请注明出处。
虽然你不注明出处我也没什么精力和你计较。
作者微信号:christgreenlaw
Disadvantages of NSLayoutConstraints
Auto Layout is a flexible way of organizing and laying out our views, provided by Apple.
但是写起来太尼玛的繁琐了。
具体怎么繁琐,用过的人都知道,没用过的人说了也白说。
相信想学习masonry 的人已经用过自动布局了。
masonry一般不会是新手上来就直接学习的库,所以不废话去解释自动布局。
具体的可以去用NSLayoutConstraints感受一下就知道了。
Maker
Heres the same constraints created using MASConstraintMaker
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);
}];
- 其中with是可选的filler,增加可读性,其实没啥用
- 上述代码接收者是view,将其上下左右都与superview 的上下左右对齐,偏移量分别为padding 的对应值
- 其中注意符号问题,正值向坐标系正方向,负值向坐标系负方向
- 纵向上,向下为正方向,横向上,向右为正方向
Or even shorter
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(superview).with.insets(padding);
}];
- 上述代码直接使用edges,等同于分别设置四个边
- 注意当使用edges时,需要使用insets属性而不是offset
Also note in the first example we had to add the constraints to the superview [superview addConstraints:...
. Masonry however will automagically add constraints to the appropriate view.
- Masonry不需要你显示地添加约束,只需要设置约束。
Masonry will also call view1.translatesAutoresizingMaskIntoConstraints = NO;
for you.
- Masonry也会自动调用上述代码。
Not all things are created equal
- 不只有
.equalTo
,等同于NSLayoutRelationEqual -
.lessThanOrEqualTo
equivalent to NSLayoutRelationLessThanOrEqual -
.greaterThanOrEqualTo
equivalent to NSLayoutRelationGreaterThanOrEqual
这三个等同性的约束可以接收以下之一作为参数:
1. MASViewAttribute
make.centerX.lessThanOrEqualTo(view2.mas_left);
MASViewAttribute | NSLayoutAttribute |
---|---|
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 |
2. UIView/NSView
if you want view.left to be greater than or equal to label.left :
//these two constraints are exactly the same
make.left.greaterThanOrEqualTo(label);
make.left.greaterThanOrEqualTo(label.mas_left);
3. NSNumber
Auto Layout allows width and height to be set to constant values. if you want to set view to have a minimum and maximum width you could pass a number to the equality blocks:
//width >= 200 && width <= 400
make.width.greaterThanOrEqualTo(@200);
make.width.lessThanOrEqualTo(@400)
However Auto Layout does not allow alignment attributes such as left, right, centerY etc to be set to constant values. So if you pass a NSNumber for these attributes Masonry will turn these into constraints relative to the view’s superview ie:
//creates view.left = view.superview.left + 10
make.left.lessThanOrEqualTo(@10)
Instead of using NSNumber, you can use primitives and structs to build your constraints, like so:
make.top.mas_equalTo(42);
make.height.mas_equalTo(20);
make.size.mas_equalTo(CGSizeMake(50, 100));
make.edges.mas_equalTo(UIEdgeInsetsMake(10, 0, 10, 0));
make.left.mas_equalTo(view).mas_offset(UIEdgeInsetsMake(10, 0, 10, 0));
By default, macros which support autoboxing are prefixed with mas_
. Unprefixed versions are available by defining MAS_SHORTHAND_GLOBALS
before importing Masonry.
4. NSArray
An array of a mixture of any of the previous types
make.height.equalTo(@[view1.mas_height, view2.mas_height]);
make.height.equalTo(@[view1, view2]);
make.left.equalTo(@[view1, @100, view3.right]);
Learn to prioritize
.priorit
allows you to specify an exact priority
.priorityHigh
equivalent to UILayoutPriorityDefaultHigh
.priorityMedium
is half way between high and low
.priorityLow
equivalent to UILayoutPriorityDefaultLow
Priorities are can be tacked on to the end of a constraint chain like so:
make.left.greaterThanOrEqualTo(label.mas_left).with.priorityLow();
make.top.equalTo(label.mas_top).with.priority(600);