关于自动适配的那点事剖析

上传人:我** 文档编号:116197104 上传时间:2019-11-16 格式:DOCX 页数:12 大小:36.66KB
返回 下载 相关 举报
关于自动适配的那点事剖析_第1页
第1页 / 共12页
关于自动适配的那点事剖析_第2页
第2页 / 共12页
关于自动适配的那点事剖析_第3页
第3页 / 共12页
关于自动适配的那点事剖析_第4页
第4页 / 共12页
关于自动适配的那点事剖析_第5页
第5页 / 共12页
点击查看更多>>
资源描述

《关于自动适配的那点事剖析》由会员分享,可在线阅读,更多相关《关于自动适配的那点事剖析(12页珍藏版)》请在金锄头文库上搜索。

1、关于自动适配的那点事 自iphone4s以后,苹果先后推出了iphone5、iphone5s、iphone6、iphone6plus、iphone6s、iphone6splus这些新的机型,它们的屏幕大小各有所异,从此给我们开发者留下了一个蛋疼的问题:屏幕适配。 1、显示坐标定位方式:在4和4s的时代,我们采用显示坐标定位方式设置一个视图的坐标,比如view.frame = CGRectMake(20, 70, 160, 160);在当时显然是没有任何问题的,因为手机屏幕的大小是固定的,屏宽320像素,屏高480像素。 2、autoresizingMask:自iphone5以后,手机屏幕的高度

2、变成了568像素,有时候我们定义的视图在iphone4和4s上运行起来位置摆放正常,但是在5和5s上就不那么和谐了,这就对开发者提出了适配的任务:如何让视图在不同大小的屏幕上恰到好处的展现出来呢?其实苹果最先推出来的跟适配沾边的技术autoresizingMask。autoresizingMask能给出子视图相对于父亲视图的对齐方式与缩放系数,当父视图发生变化时,通过每个视图autoresizingMask即可自动得出新的位置。使用步骤是第一步:设置父视图的autoresizesSubviews属性为YES,superView.autoresizesSubviews = YES;,否则后面的a

3、utoresizingMask都将失效。第二步:设置子视图的autoresizingMask, subView.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin。这里面的autoresizingMask属性是一个枚举值,枚举值各项含义如下:UIViewAutoresizingNone:就是不自动调整。UIViewAutoresizingFlexibleLeftMargin: 自动调整与superView左边的距离,保证与superView右边的距离不变。

4、UIViewAutoresizingFlexibleRightMargin: 自动调整与superView的右边距离,保证与superView左边的距离不变。UIViewAutoresizingFlexibleTopMargin: 自动调整与superView顶部的距离,保证与superView底部的距离不变。UIViewAutoresizingFlexibleBottomMargin: 自动调整与superView底部的距离,也就是说,与superView顶部的距离不变。UIViewAutoresizingFlexibleWidth: 自动调整自己的宽度,保证与superView左边和右边的

5、距离不变。UIViewAutoresizingFlexibleHeight: 自动调整自己的高度,保证与superView顶部和底部的距离不变。UIViewAutoresizingFlexibleLeftMargin|UIViewAutoresizingFlexibleRightMargin: 自动调整与superView左边的距离,保证与左边的距离和右边的距离和原来距左边和右边的距离的比例不变。比如原来距离为20,30,调整后的距离应为68,102,即68/20=102/30。遗憾的是这些技术的缺陷也十分明显,是一个不成熟的技术,原因有两点:(1)、autoresizingMask缩放比例是

6、UIKit内部计算的,开发者无法指定缩放比例的精确值。(2)、变化规则只能基于父子视图,无法解决兄弟视图之间的位置关系。所以在iOS6推出自动布局(Auto Layout)技术后,autoresizingMask成为一项鸡肋技术。可以用食之无味,弃之可惜来形容。 3、AutoLayout-可视化编程自动布局:关于AutoLayout技术有可视化编程和纯代码两种方式,本处先讲解可视化的方式。自动布局是对autoresizingMask的进一步改进,它允许开发者在界面上的任意两个视图之间建立精确的线性变化规则。所谓线性变化就是数学中的一次函数,即: y = m*x + c 其中x和y是界面中任意两

7、个视图的某个布局属性,m为比例系数,c为常量。在storyboard或者xib中设置约束的方案有三种:(1)、在设计器中长按Control键拖动控件。(2)、在左侧文档结构窗口中长按Control键拖动控件。(3)、点击设计器底部图标,pin设置距离约束、固定宽高约束、等高等宽和宽高比约束,align设置对齐约束。注意:方案(1)和(2)中同时按住Shift键与Option键可以同时设置多个约束。前面我们提到了一个重要概念就是约束,约束有很多种类,现列出如下:Leading :距离另一视图左边距离的约束 Trailing :距离另一视图左边距离的约束 Top :距离另一视图顶部距离的约束 Bo

8、ttom :距离另一视图底部距离的约束 Width:单个视图固定宽度的约束 Height:单个视图固定高度的约束 Equal Widths:两个视图等宽的约束 Equal Heights:两个视图等高的约束 Aspect Ratio:单个视图固定宽高比的约束 Horizontally in Container:固定在父视图水平方向中线的约束 Vertically in Container:固定在父视图垂直方向中线的约束 Vertically in Container:固定在非父视图水平方向中线的约束 Horizontall Centers:固定在非父视图垂直方向中线的约束 Vertical S

9、pacing:两个视图垂直方向距离的约束 Horizontally Spacing:两个视图水平方向距离的约束 align Top to:顶部对齐约束 align Bottom to:底部对齐约束 align Leading to:左边对齐约束 align Trailing to:右边对齐约束还有一些选项几乎是我们必用的,含义列出如下:Update Frames:更新坐标以适应约束 Update Constraints:更新约束以适应坐标 Add Constraints:添加约束 Constain to margins:如果你点了constrain to margins,左右会有8个点的空挡,

10、从8个点后开始计算约束,而没有点时,已屏幕的0点开始计算。建议取消勾选。我们可以在画布的右边查看每个约束的详情,我们在前面讲的y相对于x发生变化的公式 y = m*x + c 在这里得到了呼应,First Item对应公式中的y,表示因变量 Relation对应公式中的=,表示相等关系,这里显示的是Equal即相等 Second Item对应公式中的x,表示自变量 Multiplier对应公示中的m,表示缩放比例系数 Constant对应公示中的c,表示偏移常量 点击First Item或者Second Item下拉菜单,选择Reverse First And Second Item即可交换双

11、方的位置。 得反函数:x = 1/m * y - c/m值得一提的是约束既不能少,少了不能确定视图位置,也不能多,多了会冲突。另外,某些用来展现内容的用户控件,例如文本控件UILabel、按钮UIButton、图片视图UIImageView等,它们具有自身内容尺寸(Intrinsic Content Size),此类用户控件会根据自身内容尺寸添加布局约束。也就是说,如果开发者没有显式给出其宽度或者高度约束,则其自动添加的自身内容约束将会起作用。 4、AutoLayout-代码自动布局:并非所有的情况都能用IB来解决,比如定义诸如某视图的高度等于另一个视图的宽度这样的约束,通过代码构建自动布局约

12、束是最基础的,也是最灵活的方式。缺点是代码很冗长。每一个布局约束是一个NSLayoutConstraint实例,NSLayoutConstraint类的主要属性定义如下 property (readonly, assign) id firstItem; property (readonly) NSLayoutAttribute firstAttribute; property (readonly) NSLayoutRelation relation; property (readonly, assign) id secondItem; property (readonly) NSLayoutA

13、ttribute secondAttribute; property (readonly) CGFloat multiplier; property CGFloat constant; . +(instancetype)constraintWithItem:(id)firstItem attribute:(NSLayoutAttribute)firstAttribute relatedBy:(NSLayoutRelation)relation toItem:(id)secondItem attribute:(NSLayoutAttribute)secondAttribute multiplie

14、r:(CGFloat)multiplier constant:(CGFloat)constant;每一个布局约束就是一个明确的线性变化规则,在数学上是以一次函数的形式表示,即: y = m * x + c每个约束就对应如下关系: firstItem.firstAttribute =,= secondItem.secondAttribute * multiplier + constant 我们可以调用NSLayoutConstraint类的constraintWithItem:方法,传入所有需要的参数构造一个新的约束。 (1)、firstItem与secondItem分别是界面中受约束的视图与被

15、参照的视图,他们不一定非得是兄弟关系或者父子关系,只要是他们有着共同的祖先视图即可。 (2)、firstAttribute与secondAttribute分别是firstItem与secondItem的某个布局属性(NSLayoutAttribute),其中NSLayoutAttributeNotAnAttribute当我们需要为某个视图精确指定一个宽度或者高度值时,这时候secondItem为nil,secondAttribute为 NSLayoutAttributeNotAnAttribute。 (3)、relation定义了布局关系 typedef NS_ENUM(NSInteger, NSLayoutRelation) NSLayoutRelationLessThanOrEqual = -1, NSLayoutRelationEqual = 0, NSLayoutRelationGreaterThanOrEqual = 1, ; 布局关系可以是相等、大于等

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 高等教育 > 大学课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号