码迷,mamicode.com
首页 > 其他好文 > 详细

Xib、AutoLayout等使用心得

时间:2015-05-22 15:15:53      阅读:133      评论:0      收藏:0      [点我收藏+]

标签:

欢迎关注微信公共账号“Android老码农”,与老码农交流。技术分享

本文同时发表在老码农的个人独立网站:http://www.koulianbing.com/?p=83

在新项目中使用Xib有一段时间了,遇到了不少的问题,也收获了很多的奇迹,最让我惊叹的就是使用熟练之后的界面开发速度,完胜Android那种XML方式的半吊子可视化界面开发工具。这里把使用心得汇总一下,希望能帮到大家。

一、Xib的使用深度

StoryBoard不是我的菜,毕竟VC之间的逻辑关系和跳转都比较复杂,甚至有时还得实现自己的栈管理,我更喜欢只是纯页面开发的时候使用可视化工具,就像Android的XML一样。感谢苹果,XCode的可视化工具比Android那个半吊子强太多了。

Xib中页面元素与VC中的事件关联我通常自己来通过addTarget的方式手动做,一方面是因为Android中这么做习惯了,另一方面事件注册的可变性太大,VC下面有时候还会分成更小单元粒度的Controller,就像Android中的Fragment一样。

二、Xib的基本原则

1、怎么样唯一确定一个View的布局?

只要直接或者间接确定x,y,width,height这四个值就可以了。这就是Xib的中心思想。

确定x和y的方式有很多种,这里举几个常见的例子:指定View在Parent中横向居中就是确定x的值,竖向居中则是确定y的值。指定相对于上方或下方View的距离就是确定View的y值,相对于左方或右方View的距离,就是确定View的x值。同时指定View距离其左方和右方View的距离,就可以同时确定x和width,而同时指定View距离其上方和下方的View的距离,就可以同时确定y和height。

2、支持定制

对于Xib中的一个View,可以指定其Custome类,这样就把具体实现交给继承了UIView的那个类了。这样,就可以对系统提供的任何View进行扩展,再通过Xib布局在页面上。

3、代码与Xib混排

Xib中可以包含定制的View,而代码生成的View中也可以添加通过Xib而Load进内存的View。

4、Xib中View的确切布局时机

在Xib中做页面布局时,只是指定了一系列的Constraints,并由IB对这些Contraints进行预览。那这些页面中的View到底是在什么时间点布局呢?准确地说,是viewWillAppear之后和viewDidAppear之前。在这之前,Xib文件的根View默认是600*600的,并没有根据Constraints在不同的Size Class下的表现进行layout计算。也就是说,想得到布局完成的View树并进行查看或操作,至少要到viewDidAppear中。

对于通过loadNamedXib加载到内存中的View,必须手动指定其frame中的width和height,然后再通过addSubView的方式添加到现有的View树中,使用Xib表示的View在布局时,是以600*600的默认宽高进行的。

5、根View宽高不确定

我们在使用xib要时刻牢记。对于做过Android的同学来说,可以简单地把xib的根View理解成一个RelativeLayout。xib的根View的宽高是在真正程序运行到布局时才会参考当前的Size Class确定下来。所以,除非特别必要,不要使用绝对值来确定x,y,width,height的值。

6、Size Class

根据当前设备横屏、竖屏,还是手机、Pad,Xib把它们归为不同的Size Class,我们可以通过切换Size Class,让View在不同Size Class下展现不同的特性。比如,手机横屏和竖屏下,用户头像的位置分别位于屏幕上方和屏幕左方。

三、工具

可以看看这篇文章“如何使用View Debugging”,通过这个调试工具可以看到View的层级关系、边界等很详细的信息。

四、动态位置调整

这方面有一个很经典的场景,就是在经典的登录界面中,页面中主要的View从上往下依次是用户名输入框、密码输入框、校验码输入框、登录按钮。默认情况是没有校验码输入框的,这个时候登录按钮要紧挨密码输入框,一旦用户的登录触发安全策略,导致校验码输入框弹出来之后,登录按钮就要下移,给校验码输入框腾出位置来。

这在Android中可以使用Vertical的LinearLayout很轻松地布局出来,但在IOS中是没有现成的View可以做到动态调整子View位置的。只能使用稍微笨一点儿的方式,在代码中找到对应的Constraints,修改其Constant值。

这个时候需要注意,如果明确指定一个View的width和height等Constraints,那这个Constraints是属于这个View的。决定View的x、y,或间接决定width、height的其它Constraints都是在View的superView中的。不要找错了地方。

五、动态宽高

有的时候,我们可能需要根据View中的内容来动态调用一个View的宽高,如文章的Title,字数越多,Label越宽。这种情况就需要使用content hugging和content compression resistance这两个属性了。其详细的解释可以看看官方文档。

六、多练

这个是最高原则。我在新项目中除了少数几个很特殊的控件自己实现之外,99%的布局都使用Xib来完成,一开始不太熟悉稍微有些慢,等熟悉了之后,开发速度非常快。如今屏幕尺寸这么多,这AutoLayout比手工通过代码获取屏幕宽高计算View布局的方式快了岂止一个数量级。多练习,会出现奇迹的。

Xib、AutoLayout等使用心得

标签:

原文地址:http://blog.csdn.net/a345017062/article/details/45916833

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!