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功能惊叹的部分,所以趁热打铁写 ...
随机推荐
- 在ASP.NET MVC中使用Knockout实践03,巧用data参数
使用Knockout,当通过构造函数创建View Model的时候,构造函数的参数个数很可能是不确定的,于是就有了这样的一个解决方案:向构造函数传递一个object类型的参数data. <inp ...
- SpringUtils
import org.springframework.beans.BeansException; import org.springframework.context.ApplicationConte ...
- C#编程(三十)----------泛型结构,泛型方法,泛型委托
泛型结构 泛型结构和泛型类几乎是一直的,只是泛型结构没有继承的特性..NET平台提供的一个泛型结构是(可空类型)Nullablle<T>.可空类型的引入,主要是为了解决数据库语言中的数字与 ...
- C# Datatable排序(转)
C# Datatable排序 在C#中要对Datatable排序,可使用DefaultView的Sort方法.先获取Datatable的DefaultView,然后设置得到的Dataview的sort ...
- C++笔记:头文件的作用和写法
from://http://ceeji.net/blog/c%E7%AC%94%E8%AE%B0%EF%BC%9A%E5%A4%B4%E6%96%87%E4%BB%B6%E7%9A%84%E4%BD% ...
- dev的documentManager,多个tab窗体
private void AddDocument(Funcation CurrentModel) { if (!string.IsNullOrWhiteSpace(CurrentModel.Funct ...
- ASP.NET MVC:如何提供 Controller 继承体系使用的 ModelBinder?
背景 Mvc 提供了一种可扩展的模型绑定机制,具体来说就是:将客户端传递的参数按照一定的策略绑定到 action 的参数上,这带来的直接好处就是让 action 的参数支持强类型.一般来说我们有如下方 ...
- Unity3D导入3DMax模型缩放单位问题深入分析
“Unity3D导入3DMax制作的模型存在100倍缩放比例”,各Unity3D开发者基本都听过吧. 怎么保证3DMax中制作的1m导入Unity3D后还是1m? 为什么会存在100倍缩放问题? 怎么 ...
- tomcat nginx默许的post大小限制
tomcat nginx默认的post大小限制 执行大文件上传,或者,大数据量提交时,当提交的数据大小超过一定限制时,发现后台从request取值的代码request.getParameter(&qu ...
- 新闻编辑室第一季/全集The Newsroom迅雷下载
第一季 The Newsroom Season 1 (2012)看点:频出佳剧的HBO这次将目光对准了新闻间这个话题多,故事更多的“小”地方.该剧讲述的是一家虚构的有线电视新闻网ACN的故事,由阿伦· ...