Mesonry的使用方法

标签：

首先我们要引入头文件

#import "Masonry.h"

然后我们可以初始化一个控件对象 如label对象

 UILabel *label1 = [UILabel new];
    label1.backgroundColor = [UIColor redColor];
    [self.view addSubview:label1];
    //mas_make...
    
    [label1 mas_makeConstraints:^(MASConstraintMaker *make) {
        UIEdgeInsets insets = UIEdgeInsetsMake(400, 100, 100, 100);
        make.edges.equalTo(self.view).insets(insets);
    }];

上面代码初始化了一个控件对象 label1 并将label1 添加到 self.view上

通过对象调用 mas_makeConstraints....方法

block中的make 代表label1这个控件

deges表示内边距 

equalTo(参数)  参数要写的便是参照视图

insets表示具体数值 参数类型如上(UIEdgeInsets类型)  初始化方法如上 make具体为(上,左,下,右)

可以看出在block方法中 以点语法的形式调用 下面我们来列举以下make的各种属性

make.top.equalTo(参数).offset(数值) [offset为偏移量 后边还有很多这种偏移量 当偏移量为0时 可以不写]

参数值可以为两种 一种为具体控件,视图对象如label, 也可以为一个控件,视图的 上下左右 位置

 [label4 mas_makeConstraints:^(MASConstraintMaker *make) {
        //一个视图的下 是 mas_bottom
//        make.top.equalTo(label3.mas_top).offset(20);
        make.top.equalTo(label3.mas_bottom).offset(20);
        make.leading.equalTo(label3.mas_leading);
        
        make.trailing.equalTo(label3.mas_trailing);
        
        make.height.mas_equalTo(40);
        
    }];

 上面的代码中 label3为参照视图(颜色为黄色),label4为被约束视图(颜色为紫色)

1.如何判断offset值的正负

make.top.equalTo(label3.mas_bottom).offset(20);

此句代码意思是 label4 (最大x值)上 相对于 label3的下边(最大y值) 距离 为20

由图中的判断方法 参照视图label4(的位置.上) 向 被约束视图label3(的位置.下) 拉箭头 方向与 Y轴正方向相同 所以 此时offset值为正

又如 当参照视图为self.view时 有一label为被约束视图  当需求为 label右边 距离self.view 20的时候

此刻我们从self.view即(屏幕的最右边) 像左拉箭头 到label的右边 此刻我们发现箭头方向与 x轴正方向相反 所以 offset值位 负

代码为  make.right.equalTo(self.view).offset(-20); 

2.下面我整理了一些make的具体属性 "/" 表示可以使用其中任何一个

make.top/left/right/bottom.equalTo(视图对象/视图对象的上下左右)  视图对象的上下左右如此表示  view1.mas_top/left/right/bottom

.mas_top的理解 规则就是 equalTo(里面加mas_修饰的属性)

view1.mas_top 这个是写在 equalTo()括号里面的 即(视图对象的上下左右) 注意 一定要使用 .mas_top属性  而不是 .top属性

.mas_equalTo 对宽度的使用的时候要用的方法

make.height/width.mas_equalTo(具体数值) 

具体的make 属性

make.leading/trailing.equalTo(label3.mas_leading) (里面加mas_修饰的属性) 表示被约束视图 跟 参照视图 左对齐/右对齐

//大小相同的基础上 被约束视图 宽度比参照视图宽度短20 高度长40 注意此处的值为上下都比参照视图高20 左右都比参照视图短10
make.size.equalTo(label1).sizeOffset(CGSizeMake(-20, 40));

      UIEdgeInsets insets = UIEdgeInsetsMake(400, 100, 100, 100);
        make.edges.equalTo(self.view).insets(insets);

edges表示内边距 insets的值为 以上类型 

Mesonry的使用方法

标签：

原文地址：http://www.cnblogs.com/jinming-lanou/p/5551350.html