iPhone 适配之路

(1)1x时代

2007年,初代iPhone公布,屏幕的宽高是320*480像素。这个分辨率一直到iPhone3GS也保持不变。

那时编写iOS的App应用程序。仅仅支持绝对定位。

比方一个button(x, y, width, height) = (10, 20, 30, 40)。就表示它的宽度是30像素,高度是40像素,放在(10, 20)像素的位置。

(2)Retina来临

2010年,iPhone 4公布,领先採用Retina显示屏,在屏幕的物理尺寸不变的情况下,像素成倍添加。达到640*960像素。

我们能够简单算算,iPhone 4是640*960像素。对角线就是1154像素,除以3.5英寸,应该是330ppi。而官方给出的数字是326ppi。当像素太密,超过300ppi的时候。人眼也就不能区分出每一个像素。

因此iPhone 4的屏幕叫作Retina显示屏。Retina在英文中,是视网膜的意思。

为了让原有的App执行在新的手机上面。引入一个新的概念point(点)。在iPhone 3GS中,1个点等于1个像素;在iPhone 4中,1个点等于2个像素。点这个概念在iOS开发中十分重要,而非开发人员非常少关注。

将之前以像素作为单位自己主动转换成以点作为单位,使得iPhone 3GS的应用程序,不用改动也可执行在iPhone 4上面。

iPhone 4之后(x, y,width, height) = (10, 20, 30, 40)。就表示宽度为30个点。高度为40个点,放在(10, 20)个点的位置。

文字。颜色等是矢量数据,放大不会失真。原有的iPhone 3GS程序,在iPhone 4上面执行。文字显示也十分清晰。而图片并不是矢量数据。开发的时候。为使得图片清晰。须要进行图片适配。

这时须要准备两张内容同样的图片,放在同一文件夹下。

example.png      // 30x 40像素

example@2x.png   // 60 x 80像素

当程序中使用example.png的时候。会依据屏幕模式自己主动选择相应的图片。屏幕1x模式。就会选择example.png, 2x模式就会优先选择example@2x.png。而没有适配的旧程序。example@2x.png不存在,就选择example.png,生成大小为30 x 40个点,1x模式的图片,拉伸到60x80像素。所以看起来比較模糊,但它们占领的屏幕点数是一样的。

(3)加长的iPhone

2012年,苹果公布iPhone 5。跟iPhone 4相比, iPhone 5的宽度保持不变。高度添加568- 480 = 88个点。

在iOS开发中。44这个数字比較特殊。《iOS界面交互指南》中写道,人类的手指有一定大小,点击区域低于44个点的时候,就难以点中。

44的两倍就是88。

当原有程序没有适配iPhone 5的时候,也能够正常执行。但多出来的88个点将会将会被自己主动均分为上下两部分,使得上下出现黑边。

那么如何才干告诉iOS系统。应用程序已经适配了iPhone 5呢?这个时候,苹果想到了启动图。每一个机型,比方同一时候支持iPhone和iPad的程序,须要分别为iPhone跟iPad指定启动图片。

那么同一时候支持iPhone 4和iPhone 5的程序也能够使用这个办法解决。

当旧的iPhone 4的程序,执行在iPhone 5上面。没有iPhone 5的启动图片。就採用兼容模式,上下留黑边。当为iPhone 5指定了新的启动图片,系统就觉得这个应用程序是已经适配了iPhone 5的,上下就不会留黑边了。这个时候开发者获取到的屏幕高度就是568。

(4)改朝换代

iOS 7的出现,个人认为,有点儿“老乔驾崩,天下大乱”的感觉。

乔布斯于2011年辞世,2012年仅是加长的iPhone让有些人甚至怀疑库克的能力。可是苹果公司在2013年公布的iOS 7操作系统告诉世人,事实上上一年,库克在憋大招。

iOS 7彻底颠覆了老乔坚持多年的拟物化,開始进入扁平化的新纪元。

假设说曾经的适配都是软件project师的工作。这次的变化让设计师也不得不站到了前线。

质感的背景、凸起的button统统都得拍平。不不过换张图片这么简单,连视觉风格、操作习惯甚至都要又一次设计。

另一个更头疼的问题是iOS 7上状态栏是透明的。可用于程序展示的空间多出了20像素。

库克简单粗暴的直接让全部程序都在iOS 7下执行,不须要说你是否已经适配了。一时间,页面顶部的标题与状态栏重叠的现象成了大多数应用的无奈和尴尬。这更加表明了他改朝换代的决心,逼得全部应用不得不正确iOS 7进行适配。

朝代更替时总是充满着混乱。由于这个时候使用iOS 7下面操作系统的用户仍然比例不小。坚持拟物化的设计。在iOS 7手机上看着非常格格不入;设计扁平化的界面,在iOS 6手机上感觉也非常奇怪。有的开发人员宣称自己的应用已经适配iOS 7,也有的开发人员主张开发iOS 7应用并兼容iOS 6,更有一些有魄力的新公司一刀切,专为iOS 7而设计,低版本号的用户没法安装就仅仅能干瞪眼。连兼容方法也是百家争鸣,代码布局还是xib依旧争论不休。iOS 6时代遭到冷落的Autolayout也渐渐成为热门。八仙过海各显神通。到底谁对谁错就等历史来评判了。

(5)苹果也要大屏

2014年iPhone 6和6 Plus的问世,让用户们再也没有为了大屏幕而舍苹果买三星的烦恼了。但这同一时候也让开发人员和设计师陷入了更加痛苦的适配黑洞。

请看以下这张图:


iPhone的设备尺寸更加多样化。甚至还出现了406ppi的高精度屏幕。因为像素密度太大,也是为了开发方便,苹果将iPhone 6 Plus上的缩放比例添加到了3x。只是iPhone 6 Plus的实际像素是1080*1920,是比3x理想值(1284*2208)要少一点的。iPhone 6 Plus的处理方式是将程序总体略微缩小一点。分辨率非常高。这点差别,实际上也看不出来。这样处理,能够使得44个点的点击区域约束。在物理上的真实长度。基本保持不变。

我们再比較一下iPhone 5和iPhone 6的宽高比。


能够看出尽管屏幕尺寸改变了,可是它们的比例是不变的。都是9÷16 = 0.5625 的屏幕。这能够算作是一个重大利好吧。

当旧的iPhone 5程序执行在iPhone 6上面。即使没有经过适配,旧程序也能够自己主动等比放大。铺满新手机,正常执行。也有人称之为自己主动适配。但由于旧程序拉伸了,总体看起来有点模糊,也不能更好的利用大屏空间。

当须要开发人员手动适配的时候。跟iPhone 4过渡到iPhone 5一样,在新程序中,指定一张新的启动图片。

当指定了启动图,屏幕分辨率就已经变成应有的大小,新手机的屏幕更大。有很多其它的虚拟点,能够显示很多其它的内容。

这时候利用AutoLayout进行布局,同一份代码,就能够支持多个机型。假设使用代码布局,则能够推断当前设备或者屏幕分辨率而做出不同的设置。或者把代码中设置位置和大小的绝对数值都改成self.view.width之类的相对值,也能够获得更好的兼容性。

由分析能够看到,慢慢的为了适配多个机型,程序的启动图片也逐渐增多。为解决问题。Xcode 6之后。能够使用xib来搭建启动界面。这样就能够同一个启动界面,适配多个机型,降低启动图片占用的空间。

同一时候。苹果在iOS 8问世时还推出了Size Class支持对横屏和竖屏做不同的适配。在Size Class中,苹果将设备的宽和高都分为常规(Regular)和紧凑(Compact)两种状态。例如以下图所看到的:


从图中能够看出,Size Class甚至将iPad也纳入其适配范围内,让程序的适应性更加强大。而iPhone 6 Plus的横屏版不管在使用和外形上都像极了再小一号的iPad mini。

给一个使用Size Class布局的样例:


使用Size Class能够不加一行代码就实现上图所看到的的布局转换。是不是非常强大?

随着历史的发展,出现了越来越多的设备,iOS的功能页越来越强大。

望着在世界前沿一路狂奔的苹果,究竟是先设计3x压缩到2x还是先设计2x放大到3x真的还重要吗?

(6)iOS 9还有什么?

尽管iOS 9还没有正式推送,可是已经能够在苹果官方站点申请安装试用版了。

苹果这次最终成功的把服务端的开发者也拉入到了适配的黑洞之中。

iOS9系统发送的网络请求将统一使用TLS 1.2SSL。

把全部的HTTP请求都改为HTTPS了。如不更新。尽管临时也能够通过在Info.plist中声明,倒退回不安全的网络请求。可是就如iOS 7的普及一样,谁又能挡住历史的车轮呢?还是准备server更新,以解析相关数据,获得更安全的网络通信吧。

另外。iOS 9在iPad上新添加的分屏功能也是一大亮点。本文主要讲iPhone的适配,故在此不予赘述。

iOS 9即将破茧,大家密切关注吧。或许苹果还会给我们带来很多其它的惊喜呢。


參考文献:
(1)http://www.niaogebiji.com/article-4379-1.html

(2)http://www.cocoachina.com/ios/20140912/9601.html

(3)http://www.cocoachina.com/design/20141031/10106.html

(4)其它,不记得了……

原文地址:https://www.cnblogs.com/yfceshi/p/6865877.html