Masonry使用案列详解
案例一:
要求:
无论在什么尺寸的设备上(包括横竖屏切换),红色view都居中显示。
实现:
#import "ViewController.h"
#import "Masonry.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
// 防止block中的循环引用
__weak typeof(self) weakSelf = self;
// 初始化view并设置背景
UIView *view = [UIView new];
view.backgroundColor = [UIColor redColor];
[self.view addSubview:view];
// 使用mas_makeConstraints添加约束
[view mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加大小约束(make就是要添加约束的控件view)
make.size.mas_equalTo(CGSizeMake(100, 100));
// 添加居中约束(居中方式与self相同)
make.center.equalTo(weakSelf.view);
}];
}
@end
案例二:
- 要求:无论在什么尺寸的设备上(包括横竖屏切换),黑色view的左、上边距、大小都不变;
- 灰色view的右边距不变
- 宽、高、上边距黑色view相等
实现:
#import "ViewController2.h"
#import "Masonry.h"
@interface ViewController2 ()
@end
@implementation ViewController2
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
// 初始化黑色view
UIView *blackView = [UIView new];
blackView.backgroundColor = [UIColor blackColor];
[self.view addSubview:blackView];
// 给黑色view添加约束
[blackView mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加大小约束
make.size.mas_equalTo(CGSizeMake(100, 100));
// 添加左、上边距约束(左、上约束都是20)
make.left.and.top.mas_equalTo(20);
}];
// 初始化灰色view
UIView *grayView = [UIView new];
grayView.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:grayView];
// 给灰色view添加约束
[grayView mas_makeConstraints:^(MASConstraintMaker *make) {
// 大小、上边距约束与黑色view相同
make.size.and.top.equalTo(blackView);
// 添加右边距约束(这里的间距是有方向性的,左、上边距约束为正数,右、下边距约束为负数)
make.right.mas_equalTo(-20);
}];
}
@end
在上面的案例中,涉及以下内容:
1.在Masonry中,and,with都没有具体操作,仅仅是为了提高程序的可读性
make.left.and.top.mas_equalTo(20);
等价于
make.left.top.mas_equalTo(20);
2.equalTo与mas_equalTo
一般将数值类型的约束用mas_equalTo,而相对于某个控件,或者某个控件的某个约束,我会使用equalTo,如:
make.size.mas_equalTo(CGSizeMake(100, 100));
make.center.equalTo(weakSelf.view);
案例三:
要求:
- 有两个view,黑色与灰色;
- 黑色view的左、上、右边距均为20,下边距灰色view 20,宽度自适应,高度与灰色view平分整个界面;
- 灰色view宽度为黑色view的一半(即左边以中线起始),右、下边距与黑色view相同,高度与黑色view相同。
实现:
#import "ViewController3.h"
#import "Masonry.h"
@interface ViewController3 ()
@end
@implementation ViewController3
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
__weak typeof(self) weakSelf = self;
// 初始化黑色view
UIView *blackView = [UIView new];
blackView.backgroundColor = [UIColor blackColor];
[self.view addSubview:blackView];
// 给黑色view添加约束
[blackView mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加左、上边距约束
make.left.and.top.mas_equalTo(20);
// 添加右边距约束
make.right.mas_equalTo(-20);
}];
// 初始化灰色view
UIView *grayView = [UIView new];
grayView.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:grayView];
// 给灰色view添加约束
[grayView mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加右、下边距约束
make.bottom.and.right.mas_equalTo(-20);
// 添加高度约束,让高度等于黑色view
make.height.equalTo(blackView);
// 添加上边距约束(上边距 = 黑色view的下边框 + 偏移量20)
make.top.equalTo(blackView.mas_bottom).offset(20);
// 添加左边距(左边距 = 父容器纵轴横轴中心 + 偏移量0)
make.left.equalTo(weakSelf.view.mas_centerX).offset(0);
}];
}
案例四:
要求:
当键盘挡住输入框时,输入框自动向上弹到键盘上方。
实现:
这里需要使用到Masonry的另外一个方法mas_updateConstraints。这个方法用于更新控件约束。
具体的实现方式可以下载Demo来看,这里只贴出键盘弹出时的处理代码:
- (void)keyboardWillChangeFrameNotification:(NSNotification *)notification {
// 获取键盘基本信息(动画时长与键盘高度)
NSDictionary *userInfo = [notification userInfo];
CGRect rect = [userInfo[UIKeyboardFrameBeginUserInfoKey] CGRectValue];
CGFloat keyboardHeight = CGRectGetHeight(rect);
CGFloat keyboardDuration = [userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];
// 修改下边距约束
[_textField mas_updateConstraints:^(MASConstraintMaker *make) {
make.bottom.mas_equalTo(-keyboardHeight);
}];
// 更新约束
[UIView animateWithDuration:keyboardDuration animations:^{
[self.view layoutIfNeeded];
}];
}
总结:
- 可以给控件添加left/right/top/bottom/size/height/width/insert约束;
- 库提供了三个方法,mas_makeConstraints添加约束,mas_updateConstraints修改约束,mas_remakeConstraints清除以前约束并添加新约束;
- 可以通过view.mas_bottom获得view的某个约束;
- 在约束的block中,使用make来给当前控件添加约束。
大家现在在做自适应的时候经常会用到Masonry这个第三方库,你可以通过cocoapod去下载。
但是Masonry在iOS7.1的模拟器上编译通不过,主要是Masonry在iOS7.1 的模拟器上的NSLayoutConstain.h文件中找不到NSLayoutAttributeLeftMargin这个宏,这个宏是iOS8才有的,遇到这样的情况的话,解决方案如下:
在iOS7.1下去掉VIew 的autoresizing属性
Masonry使用案列详解的更多相关文章
- SqlServer中计算列详解
计算列区别于需要我们手动或者程序给予赋值的列,它的值来源于该表中其它列的计算值.比如,一个表中包含有数量列Number与单价列Price,我们就可以创建计算列金额Amount来表示数量*单价的结果值, ...
- distinct 多列详解
1.distinct单列 select distinct(a) from tableA; 2.distinct多列 select distinct a,b,c from tableA; 注意此时是将a ...
- iptables实战案例详解-技术流ken
简介 关于iptables的介绍网上有很多的资料,大家可以自己找一些关于iptables的工作原理,以及四表五链的简介,对于学习iptables将会事半功倍.本博文将会例举几个工作中常用的iptabl ...
- 转载:MySQL EXPLAIN 命令详解学习
转载自:https://blog.csdn.net/mchdba/article/details/9190771 MySQL EXPLAIN 命令详解 MySQL的EXPLAIN命令用于SQL语句的查 ...
- MySQL EXPLAIN 命令详解
MySQL EXPLAIN 命令详解 MySQL的EXPLAIN命令用于SQL语句的查询执行计划(QEP).这条命令的输出结果能够让我们了解MySQL 优化器是如何执行SQL 语句的.这条命令并没有提 ...
- Explain详解
explain语句用于查看某个查询语句具体使用了什么执行计划 执行输出各列详解 table 每条记录对应一个表的查询,如果是两表连接查询,就会有两条记录,table对应查询表名 id 查询语句可能是单 ...
- 《吐血整理》保姆级系列教程-玩转Fiddler抓包教程(4)-会话面板和HTTP会话数据操作详解
1.简介 按照从上往下,从左往右的计划,今天就轮到介绍和分享Fiddler的会话面板了. 2.会话列表 (Session list) 概览 Fiddler抓取到的每条http请求(每一条称为一个ses ...
- java基础:数组详解以及应用,评委打分案例实现,数组和随机数综合,附练习案列
1.数组 1.1 数组介绍 数组就是存储数据长度固定的容器,存储多个数据的数据类型要一致. 1.2 数组的定义格式 1.2.1 第一种格式 数据类型[] 数组名 示例: int[] arr; ...
- iOS开发——屏幕适配篇&Masonry详解
Masonry详解 前言 MagicNumber -> autoresizingMask -> autolayout 以上是纯手写代码所经历的关于页面布局的三个时期 在iphone1-ip ...
随机推荐
- 一个js(javascript)使用案例
<script type="text/javascript"> var Row; $(function () { // $("#Sel").clic ...
- iOS - ASIHTTPRequest 网络请求
前言 使用 iOS SDK 中的 HTTP 网络请求 API,相当的复杂,调用很繁琐,ASIHTTPRequest 就是一个对 CFNetwork API 进行了封装,并且使用起来非常简单的一套 AP ...
- mysql概要(九)字符集和校对集
1.mysql 字符集有细致设置: 2.mysql字符处理机制是:数据库和客户端之间存在一个字符集转换器(后文简称转换器)将客户端字符编码(必须告诉服务端的)转换成一种中间编码的数据(可自定义的但保证 ...
- 关于Spring定时任务(定时器)用法
Spring定时任务的几种实现 Spring定时任务的几种实现 一.分类 从实现的技术上来分类,目前主要有三种技术(或者说有三种产品): 从作业类的继承方式来讲,可以分为两类: 从任务调度的触发时机来 ...
- Android activity四种基本启动模式
standard:默认的模式,每次启动会新创建一个activity对象 singleTop:在当前任务栈中,判断栈顶是否为当前的activity,如果是,就直接使用,如果不是,就会创建新的activi ...
- Android保存图像到相册
在应用的图集中,通常会给用户提供保存图片的功能,让用户可以将自己喜欢的图片保存到系统相册中. 这个功能其实很好做,系统提供了现成的API: 简单的来说就这一行代码: [java] MediaStor ...
- JS 判断当前使用浏览器名及版本
由于我的后台系统的上传图片不支持IE浏览器的,所以我需要判断公司人员在使用后台系统的时候,是否使用的浏览器是IE的. // 获取当前浏览器名 及 版本号 function appInfo(){ var ...
- Mvc4_ActionLink跟@RenderBody ,@RenderPage
. @Html.ActionLink("该链接要显示的文字A","对应的控制器方法B");会生成:<a href="C/B">A ...
- html中盒子模型立体结构图
边框(border),位于盒子的第一层..元素内容(content).内边距(padding),两者同位于第二层..背景图(background-image),位于第三层..背景色(backgroun ...
- smarty 快速上手
smarty半小时快速上手入门教程 投稿:shichen2014 字体:[增加 减小] 类型:转载 时间:2014-10-27我要评论 这篇文章主要介绍了smarty半小时快速上手入门教程,以实例的形 ...