iOS自适应布局之Masonry(一)

前言

iPhone 5之前我们对应用布局停留在3.5寸一个屏幕的阶段,当时的安卓屌丝们是多么的羡慕iOS开发,不会被大量的屏幕适配所烦恼。随着iPhone产品的迭代,逐渐出现4寸、4.7寸、5.5寸….,你们说,iphone10+会有多少寸?O(∩_∩)O~

简介

正因为上面说的那样,屏幕的尺寸逐步增多,还沿用以前的方法布局显然是不行的,这时候为布局引进新的结局办法NSAutoLayout,但苹果提供的比较复杂麻烦,所以就有人在此基础上进行封装,而提供一种高效的框架—-Masonary

安装

如何安装框架?还是建议用CocoaPods,这里有我之前写的CocoaPods相关用法

         pod ‘Masonry‘

使用说明

使用参数功能说明表

开撸

1.居中显示一个View,并能时刻保持比屏幕的宽和高少60像素

UIView *view1=[[UIView alloc]init];

view1.backgroundColor=[UIColor brownColor];

[self.view addSubview:view1];

[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
    make.center.equalTo(self.view);
    make.top.equalTo(self.view).with.offset(30);
    make.left.equalTo(self.view).with.offset(30);
    make.bottom.equalTo(self.view).with.offset(-30);
    make.right.equalTo(self.view).with.offset(-30);
}];

这里需要注意的是:控件用Masonry约束的时候必须先将控件用addSubview加载到父视图中才能进行约束,不然就会造成崩溃。

Masonry中有三个函数

  • (NSArray *)mas_makeConstraints:(void(^)(MASConstraintMaker *make))block;
  • (NSArray *)mas_updateConstraints:(void(^)(MASConstraintMaker *make))block;
  • (NSArray *)mas_remakeConstraints:(void(^)(MASConstraintMaker *make))block;

mas_makeConstraints 只负责增加约束,当对同一个控件两次调用这个函数就会造成崩溃。

mas_updateConstraints 更新约束,用mas_makeConstraints定义约束之后,可以用更新约束进行补充

mas_remakeConstraints 作用比较霸道,删除之前对该控件存在的所有约束,只保留block函数里面的最新约束。

上面的

    make.center.equalTo(self.view);

    make.top.equalTo(self.view).with.offset(30);

    make.left.equalTo(self.view).with.offset(30);

    make.bottom.equalTo(self.view).with.offset(-30);

    make.right.equalTo(self.view).with.offset(-30);

你是不是想更优雅,更棒一点呢?可以这样:

UIEdgeInsets padding = UIEdgeInsetsMake(30, 30, -30, -30);
 make.center.equalTo(self.view);

 make.top.equalTo(self.view).with.offset(padding.top);

 make.left.equalTo(self.view).with.offset(padding.left);

 make.bottom.equalTo(self.view).with.offset(padding.bottom);

  make.right.equalTo(self.view).with.offset(padding.right);

我们还可以简化为

make.edges.equalTo(self.view).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));

也可以这样:

  make.top.left.bottom.and.right.equalTo(self.view).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));

这一篇主要简单学习一下Masonry,下一篇会给大家带来高级应用,_

时间: 2024-10-24 13:45:21

iOS自适应布局之Masonry(一)的相关文章

IOS自适应前段库-Masonry的使用

Masonry是一个轻量级的布局框架,拥有自己的描述语法,采用更优雅的链式语法封装自动布局,简洁明了并具有高可读性,而且同时支持 iOS 和 Max OS X.Masonry是一个用代码写iOS或OS界面的库,可以代替Auto layout.Masonry的github地址:https://github.com/SnapKit/Masonry 本章内容 - Masonry配置 - Masonry使用 - Masonry实例 Masonry配置 - 推荐使用pods方式引入类库,pod 'Maso

Masonry -- 使用纯代码进行iOS应用的autolayout自适应布局

快速入门 安装 使用 CocoaPods 安装 pod 'Masonry' 推荐在你的在 prefix.pch 中引入头文件: // 定义这个常量,就可以在使用Masonry不必总带着前缀 `mas_`: #define MAS_SHORTHAND // 定义这个常量,以支持在 Masonry 语法中自动将基本类型转换为 object 类型: #define MAS_SHORTHAND_GLOBALS #import "Masonry.h" 使用 初始Masonry 这是使用MASCo

iOS 8 by Tutorials (Section1:自适应布局)

Section1:自适应布局 iOS8中,你将有新的方法去建立界面,你有完全独立的设备.屏幕尺寸.分辨率和设备方向(device orientation),你将会了解collections的特性.size classes和通用的Storyboards,每一个功能不仅仅在现在的设备做好最好的interfaces,我想在将来也会一样.以开放的心态去阅读下面的要点,准备吃惊吧. 1.1.自适应布局的介绍: 前些年的iPhone,可能只是一个尺寸,一种分辨率,所以我们可以将界面布局写得死死的,就算是有了

iOS StoryBoard自适应布局

原文地址:点击打开链接 通用的Storyboard 通用的stroyboard文件是通向自适应布局光明大道的第一步.在一个storyboard文件中适配iPad和iPhone的布局在iOS8中已不再是梦想.我们不必再为不同尺寸的Apple移动设备创建不同的storyboard文件,不用再苦逼的同步若干个storyboard文件中的内容.这真是一件美好的事情. 我们打开Xcode,新建一个项目: 选择iOS\Application\Single View Application创建一个单视图应用:

iOS 8 by Tutorials (section2:开始自适应布局)

iOS 8 by Tutorials(翻译1.2) 1.2.开始自适应布局 ios8的巨大变化中,Adaptive Layout的引用给iOS设计师带来帮助.在设计项目时,你可以创建简单的布局来适应当前的iOS8设备,这一章节是Adaptive Layout的入门,你可以学到通用的Storyboards.size classes.布局和订制字体及超有用的助理编辑预览(通过storyboards清晰的看出项目结构).现在你可以从头开始创建用关于天气的项目,如果你不是Auto Layout的粉丝,也

iOS发展 ---- 至iPhone 6自适应布局设计 Auto Layout

Apple从iOS 6增加了Auto Layout后開始就比較委婉的開始鼓舞.建议开发人员使用自适应布局,可是到眼下为止,我感觉大多数开发人员一直在回避这个问题,无论是不是因为历史原因造成的,至少他们在心底还坚守着固定布局的老传统思想. 随着iPhone6.iPhone6 Plus的到来,使用自适应布局更是迫在眉睫的事,固定布局的老传统思想脆弱的不堪一击.如今的iPhone有4种尺寸.假设算上iPad,如今Apple的iOS设备有5种尺寸. 我们在准备使用自适应布局设计应用界面之前.能够把这5种

【IOS界面布局】横竖屏切换和控件自适应(推荐)

[IOS界面布局]横竖屏切换和控件自适应(推荐) 分类: [MAC/IOS下开发]2013-11-06 15:14 8798人阅读 评论(0) 收藏 举报 横竖屏切换 自适应 第一种:通过人为的办法改变view.transform的属性. 具体办法: view.transform一般是View的旋转,拉伸移动等属性,类似view.layer.transform,区别在于 View.transform是二维的,也就是使用仿射的办法通常就是带有前缀CGAffineTransform的类(可以到API

【转】有了Auto Layout,为什么你还是害怕写UITabelView的自适应布局?

Apple 算是最重视应用开发体验的公司了.从Xib到StoryBoard,从Auto Layout到Size Class,每一次的更新,都会给iOS应用的开发带来不小的便利.但是,对于绝对多数iOS攻城狮来说,我们依然还是很害怕写UITabelVIew的自适应布局.当然,害怕不是因为我们不会写,或者本身有什么特殊的技术点,而是因为太麻烦.当然,文章的后半部分,会给出相应的解决方案,毕竟本文不是为了吐槽而吐槽. UITabelView的自适应布局有多麻烦? 数据类型的不确定性:种类越多,页面越复

有了Auto Layout,为什么你还是害怕写UITabelView的自适应布局?

本文转载至 http://www.cnblogs.com/ios122/p/4832859.html Apple 算是最重视应用开发体验的公司了.从Xib到StoryBoard,从Auto Layout到Size Class,每一次的更新,都会给iOS应用的开发带来不小的便利.但是,对于绝对多数iOS攻城狮来说,我们依然还是很害怕写UITabelVIew的自适应布局.当然,害怕不是因为我们不会写,或者本身有什么特殊的技术点,而是因为太麻烦.当然,文章的后半部分,会给出相应的解决方案,毕竟本文不是