Awesome Masonry

Masonry:

 //左上角
    [_label1 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(_contentView1.mas_top).with.offset(5);
        make.left.equalTo(_contentView1.mas_left).with.offset(2);
        make.height.equalTo(@40);
    }];

    // 右上角
    [_label2 mas_makeConstraints:^(MASConstraintMaker *make) {
        //左边贴着label1
        make.left.equalTo(_label1.mas_right).with.offset(2);
        //上边贴着父view
        make.top.equalTo(_contentView1.mas_top).with.offset(5);
        //右边的间隔保持大于等于2，注意是lessThanOrEqual,即：label2的右边界的X坐标值“小于等于”containView的右边界的X坐标值。
        make.right.lessThanOrEqualTo(_contentView1.mas_right).with.offset(-2);
        make.height.equalTo(@40);
    }];

    //设置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];

//循环创建、添加imageView
    for (NSUInteger i = 0; i < 4; i++) {
        UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:_imageNames[i]]];
        [_imageViews addObject:imageView];
        [_containerView addSubview:imageView];
    }
    CGSize imageViewSize = CGSizeMake(IMAGE_SIZE, IMAGE_SIZE);

    //分别设置每个imageView的宽高、左边、垂直中心约束，注意约束的对象
    
    UIView __block *lastView = nil;
    MASConstraint __block *widthConstraints = nil;
    NSUInteger arrCount = _imageViews.count;
    [_imageViews enumerateObjectsUsingBlock:^(UIView* view, NSUInteger idx, BOOL *  stop) {
        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            widthConstraints = make.width.equalTo(@(imageViewSize.width));
            make.height.equalTo(@(imageViewSize.height));
            make.left.equalTo(lastView ? lastView.mas_right : view.superview.mas_left );
            make.centerY.equalTo(view.superview.mas_centerY);
            //设置最右边的imageView的右边与父view的最有对齐
            if (idx == arrCount - 1) {
                make.right.equalTo(view.superview.mas_right);
            }
            [_widthConstraints addObject:widthConstraints];
            lastView = view;
        }];
    }];

添加宏 而不写mas：

#define MAS_SHORTHAND
//define this constant if you want to enable auto-boxing for default syntax
#define MAS_SHORTHAND_GLOBALS

约束对象比例

//宽度为superView宽度的20%
make.width.equalTo(superView.mas_width).multipliedBy(0.2);

UILabel设置多行计算需要设置preferredMaxLayoutWidth：

label.preferredMaxWidth = [UIScreen mainScreen].bounds.size.width - margin - padding;

两个属性Content Compression Resistance（排挤，值越高越固定）和Content Hugging（拥抱）：

//content hugging 为1000
[view setContentHuggingPriority:UILayoutPriorityRequired
                           forAxis:UILayoutConstraintAxisHorizontal];

//content compression 为250
[view setContentCompressionResistancePriority:UILayoutPriorityDefaultLow
                                         forAxis:UILayoutConstraintAxisHorizontal];

topLayoutGuide和bottomLayoutGuide，这个两个主要是方便获取UINavigationController和UITabBarController的头部视图区域和底部视图区域。

//Masonry直接支持这个属性
make.top.equalTo(self.mas_topLayoutGuide);

相对父视图边距为10两种写法：

//相对于父视图边距为10
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[self.avatarView 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);
}];

//相对于父视图边距为10简洁写法
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.equalTo(superview).with.insets(padding);
}];

lessThan使用的数据结构：

//这两个作用完全一样
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.left.greaterThanOrEqualTo(self.view);
    make.left.greaterThanOrEqualTo(self.view.mas_left);
}];

//.equalTo .lessThanOrEqualTo .greaterThanOrEqualTo使用NSNumber
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.width.greaterThanOrEqualTo(@200);
    make.width.lessThanOrEqualTo(@400);
    make.left.lessThanOrEqualTo(@10);
}];

//如果不用NSNumber可以用以前的数据结构，只需用mas_equalTo就行
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    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(self.view).mas_offset(UIEdgeInsetsMake(10, 0, 10, 0));
}];

//也可以使用数组
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.height.equalTo(@[self.view.mas_height, superview.mas_height]);
    make.height.equalTo(@[self.view, superview]);
    make.left.equalTo(@[self.view, @100, superview.mas_right]);
}];

优先Priority、同时创建多个约束

// priority的使用
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.left.greaterThanOrEqualTo(self.view.mas_left).with.priorityLow();
    make.top.equalTo(self.view.mas_top).with.priority(600);
}];

//同时创建多个约束
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
    //让top,left,bottom,right都和self.view一样
    make.edges.equalTo(self.view);
    //edges
    make.edges.equalTo(self.view).insets(UIEdgeInsetsMake(5, 10, 15, 20));
    //size
    make.size.greaterThanOrEqualTo(self.view);
    make.size.equalTo(superview).sizeOffset(CGSizeMake(100, -50));
    //center
    make.center.equalTo(self.view);
    make.center.equalTo(self.view).centerOffset(CGPointMake(-5, 10));
    //chain
    make.left.right.and.bottom.equalTo(self.view);
    make.top.equalTo(self.view);
}];

计算UITableView的变高高度

CGFloat maxWidth = [UIScreen mainScreen].bounds.size.width - 10 * 2;

textLabel = [UILabel new];
textLabel.numberOfLines = 0;
textLabel.preferredMaxLayoutWidth = maxWidth;
[self.contentView addSubview:textLabel];

[textLabel mas_makeConstraints:^(MASConstraintMaker *make) {
    make.top.equalTo(statusView.mas_bottom).with.offset(10);
    make.left.equalTo(self.contentView).with.offset(10);
    make.right.equalTo(self.contentView).with.offset(-10);
    make.bottom.equalTo(self.contentView).with.offset(-10);
}];

[_contentLabel setContentHuggingPriority:UILayoutPriorityRequired forAxis:UILayoutConstraintAxisVertical];

兼容问题：

如果版本支持最低版本为iOS 8以上的话可以直接利用UITableViewAutomaticDimension在tableview的heightForRowAtIndexPath直接返回即可。

tableView.rowHeight = UITableViewAutomaticDimension;
tableView.estimatedRowHeight = 80; //减少第一次计算量，iOS7后支持

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    // 只用返回这个！
    return UITableViewAutomaticDimension;
}
但如果需要兼容iOS 8之前版本的话，就要回到老路子上了，主要是用systemLayoutSizeFittingSize来取高。步骤是先在数据model中添加一个height的属性用来缓存高，然后在table view的heightForRowAtIndexPath代理里static一个只初始化一次的Cell实例，然后根据model内容填充数据，最后根据cell的contentView的systemLayoutSizeFittingSize的方法获取到cell的高。具体代码如下

//在model中添加属性缓存高度
@interface DataModel : NSObject
@property (copy, nonatomic) NSString *text;
@property (assign, nonatomic) CGFloat cellHeight; //缓存高度
@end

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    static CustomCell *cell;
    //只初始化一次cell
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        cell = [tableView dequeueReusableCellWithIdentifier:NSStringFromClass([CustomCell class])];
    });
    DataModel *model = self.dataArray[(NSUInteger) indexPath.row];
    [cell makeupData:model];

    if (model.cellHeight <= 0) {
        //使用systemLayoutSizeFittingSize获取高度
        model.cellHeight = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height + 1;
    }
    return model.cellHeight;
}

动画：

动画
因为布局约束就是要脱离frame这种表达方式的，可是动画是需要根据这个来执行，这里面就会有些矛盾，不过根据前面说到的布局约束的原理，在某个时刻约束也是会被还原成frame使视图显示，这个时刻可以通过layoutIfNeeded这个方法来进行控制。具体代码如下

[aniView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.top.bottom.left.right.equalTo(self.view).offset(10);
}];

[aniView mas_updateConstraints:^(MASConstraintMaker *make) {
    make.top.equalTo(self.view).offset(30);
}];

[UIView animateWithDuration:3 animations:^{
    [self.view layoutIfNeeded];
}];