iOS Autolayout使用学习
一.为什么要使用autolayout
- 更容易适配各种设备,一套代码适用多种设备(碎片化不再只是安卓的痛)。
- autolayout +storyboard 在不写一行代码的情况下,就可以对相对简单的页面完成布局,这样ViewController里或者View里的关于布局的代码将会少很多,我们的代码更加关注业务逻辑本身。
3 .Xcode本身的可视化编程更加强大,降低了新人开发门槛。 - 更强大的表达能力。以往的spring + structs 布局只能描述父子关系视图的布局,但是autolayout不仅可以表达兄弟视图之间的布局,也可以表达同一个rootView视图层次下的不同视图之间的布局,比如视图与祖父视图的布局关系等。
ps:当然也有一些不该使用autolayout的原因,比如性能问题,比如对于频繁修改的页面(在storyboard里修改几十个约束够酸爽的)等,具体取决于实际使用场景。
二.几个概念
1.约束
约束直白的就是说描述视图的位置、大小的关系信息。比如a视图的宽度是b视图的宽度的1/2,a视图的x坐标离b视图右边10pt等。这些约束信息会最终通过布局引擎转化为视图实际的frame,所以本质上通过约束与通过代码setFrame来设置视图的坐标、大小没有区别(本质没区别意味实际还是有些区别的)。
2.计算公式
<code>view1.attribute1 = mutiplier * view2.attribute2 + constant</code>
通过约束里面的例子,大概就可以猜出这个公式了。 表示view1的某个属性(如高度)是view2的某个属性的(如宽度)的mutiplier倍 再加上constant。而且一旦添加完约束,能修改的只有constant这个属性。如果想改view2的attribute2就只能删除了,再new一个constraint,如果能通过constant完成的就尽量通过修改constant完成,减少不必要的对象生成和销毁。关于有哪些属性,可以看下iOS文档如下:
属性描述看名字就很容易知道了各个属性是神马意思了。
3.优先级
每个约束都有优先级UILayoutPriority,是一个float型值。优先级越高(最高1000),表示需要优先满足该条约束。因为可能我们给一个视图添加a,b两个约束,a与b是冲突的,但是又不想删除其中一个,那么可以通过设置优先级来解决这个问题。
4.约束添加的位置
通过在storyboard里拉约束,我们似乎可以不用管约束添加在哪里。但是如果我们手写约束的话,就需要决定将添加在哪里,下面是几个规则:
a).如果view1和view2是平级的兄弟关系,那么约束添加到view1和view2的共同父view上
b).如果view1,view2是父子关系,那么添加的父view上
c).如果view1,view2没有直接的父view,那么添加在离他们最近的父view上
d).对于那种不依照其他view的约束(比如view1的宽度为20pt,也是就是view2 = nil)的情况,约束可以直接添加在view1的约束数组里,实际测试中添加到view1的父view里也能正常工作(反正不知道怎么加的时候,如果是多个就加在最近的共同父view上,如果只有自己,就加在自己的父view上);
5.sizeclasses
苹果为了让布局与具体设备无关,提出了抽象设备的概念,也就是把设备的高抽象为compact, any, regular三种, 设备的宽也抽象为compact, any, regular三种,这样就总共有9种设备了
对应关系可以看如下图(网图):
通过在storyboard里选择不同sizeclasses:
storyboard里的sizeclasses选项再选择是否使用该视图:
是否勾选这样就可以完成在不同设备上显示不同视图了。
三.autolayout注意点
重要的事情放前面说:autolayout和手写布局一样都是通过setFrame来改变视图的位置和大小,但是需要掌握好时机才会得到想要的结果。
1.布局过程
先说下VC的生命周期的部分过程
viewDidLoad -> viewWillAppear -> updateViewConstraints -> viewWillLayoutSubviews -> viewDidLayoutSubviews -> viewDidAppear -> viewWillDisAppear -> updateViewConstraints -> viewDidDisAppear</pre>
和布局相关的有
updateConstraints -> layoutSubViews -> drawRect
对应的解释:
当view修改约束(addConstraint, removeConstraint)会触发setNeedsUpdateConstraints,
而这个在layoutSubViews之前会触发updateConstraints,完成之后会调用layoutSubViews。
UIViewController在有个updateViewConstraints 方法,这个方法实际是self.view 被设置了setNeedsUpdateConstraints(第一次展示的时候),必然会调用这个方法(与上面的解释保持一致了,第一次可以理解为为self.view增加了各种约束)。而这个方法的默认实现是调用子view的updateConstraints方法,这样就自上而下的完成了布局。
重点注意
以上两个方法都需要调用super方法,怀疑是UIView 或者UIViewController里的这些方法实现里会告知布局引擎去计算各个控件的Frame
在view的layoutSubViews或者ViewController的viewDidLayoutSubviews方法里后可以拿到view的实际frame,所以当我们真的需要frame的时候需要在这个时间点以后才能拿到
所以在自动布局中,如果获取的frame的时机不对,可能就不会是我们想要的。
回过来想一下为什么就能清楚viewDidLoad里通过setFrame的方式改过原先在storyboard里拖动的约束代码无效了,因为updateViewConstraints在viewDidLoad后执行,会覆盖掉之前的设置的frame,所以无效。如果我们在viewDidLayoutSubviews或者layoutSubViews之后去设置视图的frame则是有效的,不过不建议这样做,具体原因等下面说到动画的时候我们再解释。
2.触发ViewController自动布局的情况
这里只说iOS里最常见的两种
a)屏幕旋转
b)ViewController由不可见到可见
触发自动布局都会调用ViewController的updateViewConstraints方法,因为要得到各个视图的控件frame,必须通过约束才能拿到。
3.动画
之前用frame的时候做动画的时候
[UIView animateWithDuration::0.25 animations:^{
.view.frame = newFrame;
}];
现在推荐用修改约束来修改
_animationView2WidthConstraints.constant = 100;
[UIView animateWithDuration::0.25 animations:^{:^{
[_animationView2.superview layoutIfNeeded];
}];
之所以推荐用约束修改,是因为一旦屏幕发生旋转或者视图通过导航栏变得重新可见时,都会通过当前的约束来计算各个视图的frame以用于布局。如果使用setFrame方式给自动布局的视图作动画,那么当发生上面操作时,该视图会回到最初的模样,这可能不是我们想要的。
autolayout的基本使用就差不多了,还有更多的姿势或者技巧需要在实际实践中慢慢发现和理解,欢迎大家有问题多多交流。
PS:上面的很多姿势是在Xcode7.1和iOS9.1里解锁的,可能比较老的版本有不同的行为哦_