轻量化autolayout布局框架,支持多级映射

来源:互联网 发布:mac双系统分区大小 编辑:程序博客网 时间:2024/05/22 12:30

由于之前开发都是用的xib,并没有过多的手写autolayout,简易的VFL语法也就搞定了,也就没有刻意封装,最近一个项目是纯代码开发,用的是第三方框架massory,链式语法,简洁优雅。虽然massory是目前比较好用功能全面的布局框架,但也有一点遗憾,不能支持多级映射。

例如:
需求:把label2放在label1的正下方,距离20point。
Snip20171209_10.png

label2的高等于label1的底部偏移20point,同时宽、高、centerX等于label1

massory的实现方式

[label2 mas_makeConstraints:^(MASConstraintMaker *make) {        make.top.equalTo(label1.mas_bottom).offset(20);        make.width.centerX.height.equalTo(label1);    }];

理想状态的实现

[label2 mas_makeConstraints:^(MASConstraintMaker *make) {        make.top.centerX.width.height.equalTo(label1.mas_bottom).offset(20);    }];

带着这个疑问,昨天花了一天时间开始了重复造轮子,最终实现效果如下:

LightAutoLayout的实现方式一个简单的分类

label2.top_.centX.widt_.heit_.equalTo(label1.bott_).offset(20).on_();

讲解:
笔者使用了三个容器进行数据存储

@property (nonatomic, strong) NSMutableArray <NSNumber *>*layoutArrayM;//存储对应关系@property (nonatomic, strong) NSMutableArray <NSNumber *>*equalToArrayM;//存储常量@property (nonatomic, strong) NSMutableArray <NSNumber *>*offsetArrayM;//存储偏移值

取值顺序,先从对应关系数组取值,检查是否有依赖视图,取值偏移数组,取值常量数组,思维导图如下:
Snip20171209_12.png

对应autolayout的对应关系有三种
- 1、相对于控件本身,约束添加到自身
- 2、相对于父控件,约束添加到父控件
- 3、相对于其他视图,约束添加到父控件

具体操作还需要在实践中具体体会。

常用方法:
- 1、快速添加

label1.topLeft_(CGRectMake(100, 200, 70, 30));//对应x,y,w,hlabel1.around_();//等于父视图
  • 2、常量添加
label1.left_.top_.size_.constList(@(100),@(200),@(50),@(50),nil).on_();//对应x,y,w,h


  • 3、多级映射方法

label4的左边等于label3的右边同时偏移10point,宽和高等于100,centerY等于label3
 label4.left_.widt_.heit_.centY.equalTo(label3.righ_).offset(10).constList(@(100),@(100),nil).on_();

下载地址:
LightAutoLayout

原创粉丝点击