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]; }];