第三方库Masonry初步使用

代码加限制应该写在哪里？

• 写在Controller的ViewDidLoad里面是不合适的，这里有一篇文章可供参考。 updateViewConstraints和updateConstraints

• Masonry说明文档中有推荐，写在View的updateConstraints函数中。如果是Controller，对应的函数是updateViewConstraints。这篇文章写得比较清楚UIView相关Updating constraints、Layout、Display一些知识

• 自定义View，代码加限制，可以按照Masonry提供的这个模板来写

@implementation DIYCustomView

- (id)init {
    self = [super init];
    if (!self) return nil;

    // --- Create your views here ---
    self.button = [[UIButton alloc] init];

    return self;
}

// tell UIKit that you are using AutoLayout
+ (BOOL)requiresConstraintBasedLayout {
    return YES;
}

// this is Apple's recommended place for adding/updating constraints
- (void)updateConstraints {

    // --- remake/update constraints here
    [self.button remakeConstraints:^(MASConstraintMaker *make) {
        make.width.equalTo(@(self.buttonSize.width));
        make.height.equalTo(@(self.buttonSize.height));
    }];

    //according to apple super should be called at end of method
    [super updateConstraints];
}

- (void)didTapButton:(UIButton *)button {
    // --- Do your changes ie change variables that affect your layout etc ---
    self.buttonSize = CGSize(200, 200);

    // tell constraints they need updating
    [self setNeedsUpdateConstraints];
}

@end

几个特殊的地方

• 这是百度上可以搜索到的比较好的一篇文章Masonry介绍与使用实践(快速上手Autolayout)

• and和with函数什么也不做，但是可以增加可读性，可以省略，也可以带上。推荐还是带上比较好。

- (MASConstraint *)with {
    return self;
}

- (MASConstraint *)and {
    return self;
}

• 理解并习惯使用edges（边缘），Masonry中的例子代码。right和bottom在其他对应的使用场景是负数，这点要理解.

UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.equalTo(superview).with.insets(padding);
}];

这里的edges其实就是相当于其他布局里的padding概念，就是内边距。UIEdgeInsets是iOS中的数据类型，参数顺序是上，左，下，右，就是按照逆时针旋转。

• 至于margin，是外边距，用的地方就比较少，除非必要，还是不要多此一举了。

// View+MASAdditions.h

#if TARGET_OS_IPHONE || TARGET_OS_TV

@property (nonatomic, strong, readonly) MASViewAttribute *mas_leftMargin;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_rightMargin;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_topMargin;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_bottomMargin;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_leadingMargin;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_trailingMargin;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_centerXWithinMargins;
@property (nonatomic, strong, readonly) MASViewAttribute *mas_centerYWithinMargins;

#endif

• 很多场景是对应于父view的位置，父view对象在很多场合可以省略。mas_开头的函数，是装箱BOX操作，其实就是把数字包装为对象。所以，在方便的地方，可以省略，直接上数字，就像在IB中使用那样。上面那段代码，可以简写为:

UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.mas_equalTo(0).with.insets(padding);
}];

• leading与left；trailing与right 在正常情况下是等价的 但是当一些布局是从右至左时则会对调。换句话说就是基本可以不理不用 ，用left和right就好了。

• size和offset也是常用的，比较方便。对于offset，在right和bottom的情况，要注意用负数。整体上还是要遵照iOS左上角原点，向右、向下生长的布局坐标系。按这个思路，就方便知道该用正数还是用负数。另外，能用mas_offset的地方，就尽量用，毕竟方便。

• view1.translatesAutoresizingMaskIntoConstraints = NO;对于启用autolayout还是必要的，不过这句话已经写在Masonry中了，使用的时候不需要操心。

• 至于修改和移除限制，用另外两个函数，用法基本上也差不多

// View+MASAdditions.h

- (NSArray *)mas_updateConstraints:(void(^)(MASConstraintMaker *make))block;
- (NSArray *)mas_remakeConstraints:(void(^)(MASConstraintMaker *make))block;

• 关于水平分布和垂直分布，添加正方形（width=height）的占位view是不错的思路。在iOS9中，引入了UIStackView，就是这方面的系统控件，方便使用。

• 关于UIScrollView，引入containerView，是一个不错的主意。这个控件很特殊。除控件本身需要4个限制条件以为，其内容content view还要额外两个条件（width和height）才能最终确定。在IB中，这个控件的表达是难点。正因为内容和控件本身大小不一致，才产生了滑动的概念。而tableView，只需要控件本身的4个条件就可以了，内容在其代理中指明。这两者的区别一定要清楚，不然会觉得很奇怪。

• 苹果为了autolayout而推出的VFL，个人认为是很大的失败，不值得去学。体验不好，就算Apple又怎么样？照样被抨击！类似的例子还是有autolayout，KVO，collectionView的API，设计得都很差。强烈期望Apple能长点脑子，把这些API改得好用一点。

• 还有一篇文章，关于Label的使用例子介绍的不错。有趣的Autolayout示例-Masonry实现

• Content Compression Resistance = 不许挤我！
  这个属性说白了就是“不许挤我”。这个属性的优先级（Priority）越高，越不“容易”被压缩。也就是说，当整体的空间装不下所有的View的时候，Content Compression Resistance优先级越高的，显示的内容越完整。

• Content Hugging = 抱紧！
  这个属性的优先级越高，整个View就要越“抱紧”View里面的内容。也就是View的大小不会随着父级View的扩大而扩大。

这两个属性在Masonry中没有找到相应的函数，以下两个是系统的API

//设置label1的content hugging 为1000
[_label1 setContentHuggingPriority:UILayoutPriorityRequired
                           forAxis:UILayoutConstraintAxisHorizontal];

//设置label1的content compression 为1000
[_label1 setContentCompressionResistancePriority:UILayoutPriorityRequired
                                         forAxis:UILayoutConstraintAxisHorizontal];

//设置右边的label2的content hugging 为1000
[_label2 setContentHuggingPriority:UILayoutPriorityRequired
                           forAxis:UILayoutConstraintAxisHorizontal];

//设置右边的label2的content compression 为250
[_label2 setContentCompressionResistancePriority:UILayoutPriorityDefaultLow
                                         forAxis:UILayoutConstraintAxisHorizontal];

当然，Masonry可以给限制条件一个权限值，比如：

make.left.greaterThanOrEqualTo(label.mas_left).with.priorityLow();

make.top.equalTo(label.mas_top).with.priority(600);

• 通过父view来决定子view的位置大小是很正常的事，不过，也可以反过来，通过子view的内容来决定父view的大小。Label和TextView就很可能遇到这种情况。

• 一般需要4个限制条件决定一个view的位置和大小。对于imageView和Label这种内容决定大小的控件来说，只要2个条件指定位置就可以了，大小可以自适应。如果图片来自网络，那么还是额外添加2个表示大小的限制比较好，谁知道网络会传过来怎么样的图片。

关于源码解读

这里有一篇文章介绍iOS 源代码分析----Masonry