masonry布局（类似计算器按钮的布局）

效果图

这篇博客要讲的就是这个简易计算器的按钮布局

代码

[self.buttonArr1 mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:10 leadSpacing:10 tailSpacing:10];
    [self.buttonArr1 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@(H / 3 + 85));
        make.height.equalTo(@88);
    }];
    [self.buttonArr2 mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:10 leadSpacing:10 tailSpacing:10];
    [self.buttonArr2 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@(H / 3 + 185));
        make.height.equalTo(@88);
    }];
    [self.buttonArr3 mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:10 leadSpacing:10 tailSpacing:10];
    [self.buttonArr3 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@(H / 3 + 285));
        make.height.equalTo(@88);
    }];
    [self.buttonArr4 mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:10 leadSpacing:10 tailSpacing:10];
    [self.buttonArr4 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@(H / 3 + 385));
        make.height.equalTo(@88);
    }];
    [_zeroButton mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@(H / 3 + 483));
        make.height.equalTo(@88);
        make.width.equalTo(@183);
        make.left.equalTo(@15);
    }];
    _pointButton.frame = CGRectMake(215, H / 3 + 483, 88, 88);
    _isButton.frame = CGRectMake(315, H / 3 + 483, 88, 88);

我将每一同行按钮设立一个分组，用于调整间距，因为最后一行按钮大小不统一，我目前还不知道统一调整间距的方法，故直接用frame设置

函数解析

withFixedSpacing: //每个view中间的间距
leadSpacing: //左最开始的间距
tailSpacing:; //右边最后的的间距

// 实现masonry水平固定间隔方法
[self.masonryViewArray mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:30 leadSpacing:10 tailSpacing:10];



 // 设置array的垂直方向的约束

[self.masonryViewArray mas_makeConstraints:^(MASConstraintMaker *make) {

    make.top.equalTo(150);

    make.height.equalTo(80);

}];





// 实现masonry垂直固定控件高度方法
[self.masonryViewArray mas_distributeViewsAlongAxis:MASAxisTypeVertical withFixedSpacing:30 leadSpacing:10 tailSpacing:10];


// 设置array的水平方向的约束

[self.masonryViewArray mas_makeConstraints:^(MASConstraintMaker *make) {

     

    make.left.equalTo(150);

    make.width.equalTo(80);

}];