Masonry

Masonry的一些用法

在使用Masonry时，如果不想使用mas_前缀，可在.pch文件中，在导入Masonry.h之前，定义MAS_SHORTHAND

//define this constant if you want to use Masonry without the 'mas_' prefix
#define MAS_SHORTHAND

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

#import "Masonry.h"

使用方式

基本

添加基本约束

    //with is semantic and option
    [redView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(superview.mas_top).with.offset(padding); //with with
        make.left.equalTo(greenView.mas_right).offset(padding); //without with
        make.bottom.equalTo(blueView.mas_top).offset(-padding);
        make.right.equalTo(superview.mas_right).offset(-padding);
        make.width.equalTo(greenView.mas_width);

        make.height.equalTo(@[greenView, blueView]); //can pass array of views
    }];

    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(greenView.mas_bottom).offset(padding);
        make.left.equalTo(superview.mas_left).offset(padding);
        make.bottom.equalTo(superview.mas_bottom).offset(-padding);
        make.right.equalTo(superview.mas_right).offset(-padding);
        make.height.equalTo(@[greenView.mas_height, redView.mas_height]); //can pass array of attributes
    }];

使用常量

    [purpleView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@20);
        make.left.equalTo(@20);
        make.bottom.equalTo(@-20);
        make.right.equalTo(@-20);
    }];

    // auto-boxing macros allow you to simply use scalars and structs, they will be wrapped automatically

    [orangeView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.center.equalTo(CGPointMake(0, 50));
        make.size.equalTo(CGSizeMake(200, 100));
    }];

使用edge

    UIView *lastView = self;
    for (int i = 0; i < 10; i++) {
        UIView *view = UIView.new;
        view.backgroundColor = [self randomColor];
        view.layer.borderColor = UIColor.blackColor.CGColor;
        view.layer.borderWidth = 2;
        [self addSubview:view];

        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            make.edges.equalTo(lastView).insets(UIEdgeInsetsMake(5, 10, 15, 20));
        }];

        lastView = view;
    }

更新约束

有关于修改约束，Apple文档介绍如下：Changing Constraints

Update Pass是：

The system traverses the view hierarchy and calls the updateViewConstraints method on all view controllers, and the updateConstraints method on all views. You can override these methods to optimize changes to your constraints

系统遍历view层级，在控制器中调用updateViewConstraints方法，在view上调用 updateConstraints方法

所以在Masonry中，也是重写了view的updateConstraints方法（注意在方法最后要调用父类的方法），调用setNeedsUpdateConstraints 方法

要注意，不要在updateConstraints方法中调用setNeedsUpdateConstraints方法

其demo如下（有修改）：

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

    [self.growingButton updateConstraints:^(MASConstraintMaker *make) {
        make.center.equalTo(self);
        [make.width.equalTo(@(self.buttonSize.width)) priorityLow];
        [make.height.equalTo(@(self.buttonSize.height)) priorityLow];
        [make.width.lessThanOrEqualTo(self) priorityHigh];
        [make.height.lessThanOrEqualTo(self) priorityHigh];
    }];

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

//按钮的点击事件
- (void)didTapGrowButton:(UIButton *)button {
    self.buttonSize = CGSizeMake(self.buttonSize.width * 1.3, self.buttonSize.height * 1.3);

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

    // update constraints now so we can animate the change
    [self updateConstraintsIfNeeded];

    [UIView animateWithDuration:0.4 animations:^{
        [self layoutIfNeeded];
    }];
}

还有就是，如果更新约束时要做动画，建议如下：

[containerView layoutIfNeeded];
[UIView animateWithDuration:1.0 animations:^{
  // Make all constraint changes here
  [containerView layoutIfNeeded];
}];

效果如下：

重新设置约束

使用remakeConstraints方法，如下：

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

    [self.movingButton remakeConstraints:^(MASConstraintMaker *make) {
        make.width.equalTo(@(100));
        make.height.equalTo(@(100));

        if (self.topLeft) {
            make.left.equalTo(self.left).with.offset(10);
            make.top.equalTo(self.top).with.offset(10);
        }
        else {
            make.bottom.equalTo(self.bottom).with.offset(-10);
            make.right.equalTo(self.right).with.offset(-10);
        }
    }];

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

- (void)toggleButtonPosition {
    self.topLeft = !self.topLeft;

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

    // update constraints now so we can animate the change
    [self updateConstraintsIfNeeded];

    [UIView animateWithDuration:0.4 animations:^{
        [self layoutIfNeeded];
    }];
}

效果如下：