[iOS开发]- Masonry学习

安装Masonry

• 前提在电脑上安装好cocoa pods大佬博客
• 打开终端
  
• cd 空格 拖入需要下载Masonry的Xcode文件
• pod init创建pod 输入open Podfile
  
• 打开pod 文件添加这么一句话 pod ‘Masonry’ 并且 Command + S保存 记得引号是英文的，之前下载不好因为引号是中文的无法编译
• pod install
• 打开添加了masonry的文件， 多了后面四个文件意味着安装成功了

学习使用masonry库

关于masonry

• Masonry是一个对系统NSLayoutConstraint进行封装的第三方自动布局框架，采用链式编程的方式提供给开发者API。系统AutoLayout支持的操作，Masonry都支持.
• 简单的说 Masonry是一个iOS开发布局框架，以适配各种机型，相比原生的NSLayoutConstraint，提高了使用容易度和代码的可阅读程度。

使用Masonry

• 参考博客，知道了masonry有一些约束和必要的注意地地方在此罗列，日后学习使用的可能更多，这里只是初识
• • 在需要使用Masonry来添加约束的文件中要写#import "Masonry.h"来引用Masonry文件。
• • 使用Masonry添加约束需要在addSubview方法之后，否则程序会报错。
• Masonry的实现就是对其封装好的函数的使用，网上查询函数有如下

mas_makeConstraints()    添加约束
mas_remakeConstraints()  移除之前的约束，重新添加新的约束
mas_updateConstraints()  更新约束，写哪条更新哪条，其他约束不变

equalTo()       参数是对象类型，一般是视图对象或者mas_width这样的坐标系对象
mas_equalTo()   和上面功能相同，参数可以传递基础数据类型对象，可以理解为比上面的API更强大

width()         用来表示宽度，例如代表view的宽度
mas_width()     用来获取宽度的值。和上面的区别在于，一个代表某个坐标系对象，一个用来获取坐标系对象的值

masonry——demo

• 这里我实现了一个视图重叠功能，子视图放在父视图上，改变父视图位置即可改变子视图

#import "ViewController.h"
#import "Masonry.h"
@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    //
    self.view.backgroundColor = [UIColor whiteColor];
    // Masonry布局
    UIView* ViewDad = [[UIView alloc] initWithFrame:CGRectZero];
    ViewDad.backgroundColor = [UIColor redColor];
    [self.view addSubview:ViewDad];
    
    UIView* ViewSon = [[UIView alloc] initWithFrame:CGRectZero];
    ViewSon.backgroundColor = [UIColor orangeColor];
    [ViewDad addSubview:ViewSon];
    
    UIView* ViewSon2 = [[UIView alloc] initWithFrame:CGRectZero];
    ViewSon2.backgroundColor = [UIColor blueColor];
    [ViewSon addSubview:ViewSon2];
    
    UIButton* button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    [button setTitle:@"iOS" forState:UIControlStateNormal];
    [ViewSon2 addSubview:button];
    //先addSbuView 否则报错
    //在使用Masonry添加约束之前，需要在addSubview之后才能使用，否则会导致崩溃。
    
    [ViewDad mas_makeConstraints:^(MASConstraintMaker *make) {
        //规定当前视图距离父视图顶端的距离
        make.top.mas_offset(150);
        //规定当前视图距离父视图左端的距离
        make.left.mas_equalTo(70);
        //规定当前视图自身的宽度
        make.width.mas_offset(250);
        //规定当前视图自身的高度
        make.height.mas_equalTo(250);

    }];
    [ViewSon mas_makeConstraints:^(MASConstraintMaker *make) {
        //规定当前视图距离父视图顶端的距离
        make.top.mas_offset(25);
        //规定当前视图距离父视图左端的距离
        make.left.mas_equalTo(25);
        //规定当前视图自身的宽度
        make.width.mas_offset(200);
        //规定当前视图自身的高度
        make.height.mas_equalTo(200);
        
    }];
    [ViewSon2 mas_makeConstraints:^(MASConstraintMaker *make) {
        //规定当前视图距离父视图顶端的距离
        make.top.mas_offset(25);
        //规定当前视图距离父视图左端的距离
        make.left.mas_equalTo(25);
        //规定当前视图自身的宽度
        make.width.mas_offset(140);
        //规定当前视图自身的高度
        make.height.mas_equalTo(140);
        
    }];
    [button mas_makeConstraints:^(MASConstraintMaker *make) {
        //规定当前视图距离父视图顶端的距离
        make.top.mas_offset(40);
        //规定当前视图距离父视图左端的距离
        make.left.mas_equalTo(40);
        //规定当前视图自身的宽度
        make.width.mas_offset(50);
        //规定当前视图自身的高度
        make.height.mas_equalTo(50);
        
    }];    
}
@end

• 注意
• • 先添加视图 addSubView 之后在进行约束，如果先约束再addView会出现
• 效果