[iOS]-Masonry的使用

Masonry介绍

Masonry是一个iOS开发布局框架，可以适配各种机型，相比原生的NSLayoutConstraint，提高了使用容易度和代码的可阅读程度。

首先需要准备的点：

使用Masonry需要配置Cocoapods环境和安装Masonry第三方库
参考如下：
配置Cocoapods环境：2021年CocoaPods安装方法（这里推荐一位大佬的博客）
其中关键的点有：没有rvm的一定要按照给的方法安装rvm,如果失败就换个网络多试几次，安装rvm后需要按照所给的方法去安装ruby3.0（由于Big Sur系统的m1 mac现版本系统默认的是ruby2.6），完成上方的操作后最后再按流程完成其余的简单步骤即可实现配置Cocoapods环境

安装Masonry第三方库流程如下：

Xcode新建一个项目，用终端cd到项目目录下
再到终端中输入 pod init 来创建一个Podfile文件
接着再到终端中输入 open Podfile 来打开Podfile文件
在文件中添加 pod ‘Masonry’ 这句话并保存退出
最后在终端中输入 pod install 开始下载该第三方库

其中最后一步的pod install常常会由于网络等因素而下载失败，如果失败的话多试几次或者换个网络试，直到成功即可，成功之后打开项目只需要点击xxx.xcworkspace文件即可

Masonry的使用

重要的点：

在需要使用Masonry来添加约束的文件中要写#import "Masonry.h"来引用Masonry文件。
使用Masonry添加约束需要在addSubview方法之后，否则程序会报错。

Masonry的使用其实就是对于其中的API的使用，一些基础的API如下：

//添加约束
mas_makeConstraints()
//移除之前的约束，重新添加新的约束
mas_remakeConstraints()
//更新约束，写哪条更新哪条，其他约束不变
mas_updateConstraints()//equalTo的类型为id，里面不能直接填数字，例如如果非要填，括号里就要填成@100等（数字前面加@）:
equalTo()
//和上面功能相同，参数可以传递基础数据类型对象，可以理解为比上面的API更强大，例如要添加数字时就可以直接写成100等
mas_equalTo()
//顶部距离父视图的mas_top有+x个单位(x为实际括号里所输入的值)，规定向下为正
mas_offset()//用来表示宽度，例如代表view的宽度
width()
//用来获取宽度的值。和上面的区别在于，一个代表某个坐标系对象，一个用来获取坐标系对象的值
mas_width()

更新约束：（苹果官方建议：添加/更新约束在方法：updateConstraints内）代码如下：

//例如点击一个按钮后更新约束，则代码写在按钮的点击时间中，如下：
- (void) pressButton:(UIButton *)button {//方法有三种，分别如下：//1.告知需要更新约束，但不会立刻开始，系统然后调用updateConstraints[self setNeedsUpdateConstraints];//2.告知立刻更新约束，系统立即调用updateConstraints[self updateConstraintsIfNeeded];//3.这里动画当然可以取消，具体看项目的需求//系统block内引用不会导致循环引用，block结束就会释放引用对象[UIView animateWithDuration:0.4 animations:^{[self layoutIfNeeded]; //告知页面立刻刷新，系统立即调用updateConstraints}];
}//在方法：updateConstraints内更新约束
- (void)updateConstraints {//更新约束[self.xxx updateConstraints:^(MASConstraintMaker *make) {//code}];//最后必须调用父类的更新约束[super updateConstraints];
}//设置requiresConstraintBasedLayout为YES
+ (BOOL)requiresConstraintBasedLayout{return YES ;
}

一个Masonry使用的最基础的例子：

例如将视图二添加到视图一上这样一个简单的层级关系：

- (void)viewDidLoad {[super viewDidLoad];// Do any additional setup after loading the view.self.view.backgroundColor = [UIColor whiteColor];//使用Masonry布局，基本可以抛弃CGRectMake了，直接初始化即可UIView *firstView = [[UIView alloc] initWithFrame:CGRectZero];firstView.backgroundColor = [UIColor orangeColor];UIView *secondView = [[UIView alloc] initWithFrame:CGRectZero];secondView.backgroundColor = [UIColor greenColor];//在做布局之前，一定要先将view添加到superview上，否则会报错[self.view addSubview:firstView];[firstView addSubview:secondView];//mas_makeConstrains就是Masonry的autolayout添加函数，将所需的约束添加到block中就行[firstView mas_makeConstraints:^(MASConstraintMaker *make) {//规定当前视图距离父视图顶端的距离make.top.mas_offset(100);//规定当前视图距离父视图左端的距离make.left.mas_equalTo(20);//规定当前视图自身的宽度make.width.mas_offset(250);//规定当前视图自身的高度make.height.mas_equalTo(250);}];[secondView mas_makeConstraints:^(MASConstraintMaker *make) {//规定当前视图距离父视图顶端的距离make.top.mas_offset(25);//规定当前视图距离父视图左端的距离make.left.mas_equalTo(25);//规定当前视图自身的宽度make.width.mas_offset(200);//规定当前视图自身的高度make.height.mas_equalTo(200);}];
}
@end

最终的显示效果：

Masonry Demo