版权:张英堂
欢迎转载,转载请注明出处。
做的项目很多,一到适配的时候头就大了,IOS6,7的适配,屏幕的适配,当然还有下一步要出4.7屏幕,也要做适配。。。。悲剧的移动端的人员。
怎么做一个通用的适配呢?
对于IOS6, 7要做的适配最大的就是风格的改变,当然这个就需要设计师来搞定了。然后就是原点的改变。 IOS7 的原点是从屏幕左上角开始。不论是否添加了navigation。
而IOS6 的原点确实计算状态栏,navigation的高度,也就是20 + 44, 找到问题了,好了,开始解决,上代码!
这是我写的两个VC的基类,一个是带navigation的,一个是不带的。
代码很简单:这个是带navigation的,也就是高度 - 64,以及原点要从20 + 44 开始算。 (注:以下都以IOS7 为标准,向下兼容IOS6 的做法)
同理,不带navigation的,只需要 - 20 就好了。
这是最简单的适配。这时候有同学说了,我要使用ib文件怎么做呢,莫着急,先来分析一下,有什么办法。
1.最简单的,就是做两套xib,根据版本来确定。哈哈,貌似没人愿意这么做吧。费时费力,不讨好。
2.利用苹果自带的来使用。开始上图了。(以一个简单的登录页面讲解。)
首先咱么先打开,看一下IB包含的属性
这时候注意一下红色区域
这里是适配的重点, 这时候点一下 view as , 包含了两个选项,一个是7.0 later, 一个是6.1later。 这两个就是分别在两个版本下的预览,为了看一下效果的,可以点一下看看,是否转化了。
有细心的同学发现了,那个auto layout 我给取消了,为什么要取消呢,这就是适配的重点。
点击我红色标示的地方,发现了吗,和你的有区别吧。那个自动排版是默认的,必须取消才能做继续的,继续咱们下一步,
看到这一块,autosizing, 这个就是为了以后的适配做准备,这里外圈,有上下左右四个,也就是离边框的距离,可以自己选择,一边要看自己的界面,如果这个view在偏上,我就会选择上,左,右而不会选择下,具体为什么,这个需要自己理解,不好说的。如果偏下的view就选择下,左,右,当然你也可以左右,只选择一个。这样就做好4.0, 3.5 屏幕的适配。
不过苹果也给好了,直接用ib文件做 版本适配。
下面就以我登陆界面的 返回 按钮来讲解。
---
后边的图是右边的属性栏,这里就表明了 IOS 6/7 deltas 这就是适配了。这里的标准是 前面介绍的,在 view as 的视图,一般我都是 IOS7 ,做IOS6 的适配,也分析过,他们最大的区别就是远点的改变,那么在我这个视图中,没有navigation,所以这里,只需要给 Y坐标 - 20个 像素就好了,如果带了navigation就需要 - 64个像素了。也可以以整个页面来做这里的数值,
例如:
--------
这样就不用每一个空间都去更改数值了。好了,看效果,以返回键为准:
在IOS7 的情况下,是正好的,上边留下了一个状态栏,那么看咱们设置之后的效果如何
好,到此完成,达到咱们的效果了。
对于屏幕大小的适配,如果用代码的情况下,可以参照刚才步骤中的,分为上下左右。如果一个控件在偏上的位置,就从上边开始算,如果在偏下的位置,就要从下部开始计算,用屏幕的高度 - 离下边框的距离。
文章到此结束,欢迎经常参观,每周一次更新。
版权:张英堂。