Masonry自动布局使用
Masonry是一个轻量级的布局框架,采用更好的语法封装自动布局,它有自己的布局DSL。简洁明了并具有高可读性 而且同时支持 iOS 和 Max OS X。
NSLayoutConstraints的缺点
NSLayoutConstraints是一个强大且灵活的自动布局架构,可是通过代码创建的约束是十分冗余,下面我们通过一段代码来实现你想要一个视图铺满它的父视图。但是边距为10
UIView *superview = self; UIView *view1 = [[UIView alloc] init];
view1.translatesAutoresizingMaskIntoConstraints = NO;
view1.backgroundColor = [UIColor greenColor];
[superview addSubview:view1]; UIEdgeInsets padding = UIEdgeInsetsMake(, , , ); [superview addConstraints:@[ //view1 constraints
[NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:padding.top], [NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeLeft
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeLeft
multiplier:1.0
constant:padding.left], [NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:-padding.bottom], [NSLayoutConstraint constraintWithItem:view1
attribute:NSLayoutAttributeRight
relatedBy:NSLayoutRelationEqual
toItem:superview
attribute:NSLayoutAttributeRight
multiplier:
constant:-padding.right], ]];
即使一个简单的例子所需的代码都相当冗长,当你有超过 2 或 3 视图时变得不可读,另一种选择是使用可视化格式语言 (VFL),有点不太冗长。然而,ASCII 类型语法上有它自己的陷阱并且作为 NSLayoutConstraint constraintsWithVisualFormat: 添加动画效果 返回一个数组也有点难。
Masonry的优点
下面是使用MASConstraintMaker创建同样的约束
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[self.subview mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.view.mas_top).with.offset(padding.top);
make.left.equalTo(self.view.mas_left).with.offset(padding.left);
make.bottom.equalTo(self.view.mas_bottom).with.offset(-padding.bottom);
make.right.equalTo(self.view.mas_right).with.offset(-padding.right);
}];
更短代码实现
[self.subview mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view).with.insets(padding);
}];


此外还需注意使用NSLayoutConstraints时调用了[superview addConstraints:... ] 方法,在Masonry库中是自动向当前视图添加约束的,我们也可以通过self.subview.translatesAutoresizingMaskIntoConstraints = NO来手动设置。
并不是所有创建都一样
.equalTo 等价于 NSLayoutRelationEqual
.lessThanOrEqualTo 等价于 NSLayoutRelationLessThanOrEqual
.greaterThanOrEqualTo 等价于 NSLayoutRelationGreaterThanOrEqual
这些三个等式约束可以是下列任一操作作为一个参数
1. MASViewAttribute
| MASViewAttribute | NSLayoutAttribute |
|---|---|
| view.mas_left | NSLayoutAttributeLeft |
| view.mas_right | NSLayoutAttributeRight |
| view.mas_top | NSLayoutAttributeTop |
| view.mas_bottom | NSLayoutAttributeBottom |
| view.mas_leading | NSLayoutAttributeLeading |
| view.mas_trailing | NSLayoutAttributeTrailing |
| view.mas_width | NSLayoutAttributeWidth |
| view.mas_height | NSLayoutAttributeHeight |
| view.mas_centerX | NSLayoutAttributeCenterX |
| view.mas_centerY | NSLayoutAttributeCenterY |
| view.mas_baseline | NSLayoutAttributeBaseline |
2. UIView/NSView
如果你想要view.left大于或等于label.left可以
make.left.greaterThanOrEqualTo(label);
make.left.greaterThanOrEqualTo(label.mas_left);
3. NSNumber
自动布局允许宽度和高度设置为常量值。如果你想要将视图具有最小值和最大宽度设置你可以
//width >= 200 && width <= 400
make.width.greaterThanOrEqualTo(@);
make.width.lessThanOrEqualTo(@)
然而自动布局不允许对齐属性如左对齐、 右对齐,centerY等将设置为常量值
//creates view.left = view.superview.left + 10
make.left.lessThanOrEqualTo(@)
make.top.mas_equalTo();
make.height.mas_equalTo();
make.size.mas_equalTo(CGSizeMake(, ));
make.edges.mas_equalTo(UIEdgeInsetsMake(, , , ));
make.left.mas_equalTo(view).mas_offset(UIEdgeInsetsMake(, , , ));
您可以使用基元和结构打造你的约束替代 NSNumber。默认情况下,支持自动装箱的宏均以 mas_ 作为前缀。没有前缀的版本均可通过导入之前定义 MAS_SHORTHAND_GLOBALS。
4. NSArray
make.height.equalTo(@[view1.mas_height, view2.mas_height]);
make.height.equalTo(@[view1, view2]);
make.left.equalTo(@[view1, @, view3.right]);
优先原则
.priority 允许你指定优先级
.priorityHigh等价于 UILayoutPriorityDefaultHigh高优先级
.priorityMedium 中等优先级
.priorityLow 等价于 UILayoutPriorityDefaultLow
make.left.greaterThanOrEqualTo(label.mas_left).with.priorityLow(); make.top.equalTo(label.mas_top).with.priority();
组成
Masonry也提供了几个方便的方法,同时创建多个约束,被称为 MASCompositeConstraints。
edges
// make top, left, bottom, right equal view2
make.edges.equalTo(view2); // make top = superview.top + 5, left = superview.left + 10,
// bottom = superview.bottom - 15, right = superview.right - 20
make.edges.equalTo(superview).insets(UIEdgeInsetsMake(, , , ))
center
// make centerX and centerY = button1
make.center.equalTo(button1) // make centerX = superview.centerX - 5, centerY = superview.centerY + 10
make.center.equalTo(superview).centerOffset(CGPointMake(-, ))
// All edges but the top should equal those of the superview
make.left.right.and.bottom.equalTo(superview);
make.top.equalTo(otherView);
Masonry自动布局使用的更多相关文章
- Masonry自动布局
介绍,入门: http://www.cocoachina.com/ios/20141219/10702.html 下载: http://code.cocoachina.com/detail/30114 ...
- Masonry自动布局与UIScrolView适配
Masonry介绍 Masonry是一个轻量级的布局框架 拥有自己的描述语法 采用更优雅的链式语法封装自动布局 简洁明了 并具有高可读性 而且同时支持 iOS 和 Max OS X.可以通过cocoa ...
- Masonry自动布局:复合约束
前言 说到iOS自动布局,有很多的解决办法.有的人使用xib/storyboard自动布局,也有人使用frame来适配.对于前者,笔者并不喜欢,也不支持.对于后者,更是麻烦,到处计算高度.宽度等,千万 ...
- IOS Masonry自动布局
之前项目用Frame布局,这个项目登录用了VFL,后来觉得用Masonry,前天布局TableViewCell时用了下 ,觉得还不错. #import "Masonry.h" #i ...
- 【iOS】Masonry 自动布局 MASViewConstraint.m:207 错误
问题详情: Assertion failure 报错原因: make.right.equalTo([_imageView superview]).right.with.offset(-); make. ...
- Coding源码学习第四部分(Masonry介绍与使用(三))
接上篇继续进行Masonry 的学习. (12)tableViewCell 布局 #import "TableViewController.h" #import "Tes ...
- masonry使用问题
2015年11月3日 coreData的学习练习中复习使用masonry自动布局 masonry自动布局发现问题: 两个控件的相对布局: 如果被参考对象用这个带anchor的属性,就会报这样一个错误: ...
- iOS masonry 不规则tagView布局 并自适应高度
在搜索页面经常会有不规则的tag出现,这种tagView要有点击事件,单个tagView可以设置文字颜色,宽度不固定根据内容自适应,高度固定,数量不固定.总高度就不固定.最近对于masonry的使用又 ...
- Masonry学习札记
Masnory学习札记 在之前的文章里有草草提到过Masonry自动布局,可这么重要第三方布局框架的怎么可以怎么随便带过呢!昨天在完成页面的时候刚好遇到了被Masorny功能惊叹的部分,所以趁热打铁写 ...
随机推荐
- Snmp学习总结(三)——Win7安装和配置SNMP
一.安装SNMP Win7操作系统默认情况下是不安装SNMP服务的,今天讲解一下在Win7操作系统下安装SNMP,具体安装步骤如下: WIN7操作系统下安装SNMP的步骤如下: 开始安装SNMP
- 为什么MacBook装Windows这么火?
Mac到底要不要装Windows?一直以来这都是个很有争议性的话题.只要你经常浏览国内一些知名Mac论坛,就会发现那里不仅有各种Mac装Windows教学贴.讨论区,而且时不时还会冒出关于“Mac装不 ...
- Unity3D实践系列08, MonoBehaviour类的各种触发事件
在脚本的生命周期中,有Awake, Start, FixedUpdate, Update, LateUpdate等方法,其实这些属于MonoBehaviour类的事件响应方法,是MonoBehavio ...
- 发布网站时应该把debug设置false
在ASP.NET项目根目录下的Web.config中有这样的一个节点: <compilation debug="true" targetFramework="4.5 ...
- Java知识回顾 (3)运算符
位运算符 Java定义了位运算符,应用于整数类型(int),长整型(long),短整型(short),字符型(char),和字节型(byte)等类型. 位运算符作用在所有的位上,并且按位运算.假设a ...
- Spring Boot 2中对于CORS跨域访问的快速支持
原文:https://www.jianshu.com/p/840b4f83c3b5 目前的程序开发,大部分都采用前后台分离.这样一来,就都会碰到跨域资源共享CORS的问题.Spring Boot 2 ...
- ASIHTTPRequestErrorDomain Code=5
ASIHttpRequest解析带空格的URL时 出错!!!(已解决) 用的是post请求 URL 地址是: http://111.234.51.56/login_member.pl?time=201 ...
- Linux学习19-gitlab配置邮箱postfix(新用户激活邮件)
前言 gitlab新增新用户有两种方式,第一种可以用户主动注册(自己设置密码):第二种也可以通过root管理员用户直接添加用户,发个邮件到用户的邮箱里,收到邮件后激活. 如果是第二种方式添加新用户的话 ...
- xheditor-文件上传-java-支持html5-application/octet-stream
package reyo.sdk.utils.file; import java.io.BufferedOutputStream; import java.io.File; import java.i ...
- svn: E155015: 提交失败(细节如下) 解决办法
svn 出现冲突是经常发生的事,最近改用命令操作svn,用界面电脑有些反应慢 出现冲突使用svn 命令肯定也是可以解决的: 查看警告信息提示冲突的文件,执行 svn resolved <文件名& ...