让你的应用支持新iPad的Retina显示屏

标签: 应用 ipad retina | 发表时间:2012-03-24 08:00 | 作者:[email protected] (秩名)
出处:http://www.kuqin.com/jingyan/

上周起大家伙纷纷开始上手第三代iPad了。由于新iPad采用了Retina显示屏,分辨率较上一代iPad增加了一倍(译者:长宽增加一倍,像素是上一代的四倍)。为了支持新增的这些个像素,iOS开发者需要考虑升级自己的iPad应用,我在下文列举了一些必须注意的事项。

一、应用图片

标准iOS控件里的图片资源,苹果已经做了相应的升级,我们需要操心的是应用自己的图片资源。就像当初为了支持iPhone 4而制作的@2x高分辨率版本(译者:以下简称高分)图片一样,我们要为iPad应用中的图片制作对应的高分版本。我知道不少开发者很有预见性的早在iOS 5.0 SDK上就完成了这一步升级。可是我还是要强调一点,那就是之前 Michael Jurewitz (@Jury)在推上提到过的:

— 如果想让你的高分图片显示在新iPad上,你必须用Xcode 4.3.1 连同iOS 5.1 SDK编译!

the-new-ipad

二、应用图标

接下来肯定就是为应用主图标制作高分版本了,因为低分版的图标在新iPad桌面上看起来会惨不忍睹。为了支持更多的iOS设备、更高分辨率的屏幕,iOS开发者需要为自己的应用准备各种尺寸的主程序图标文件,而且这个文件列表貌似会越来越长越来越长……(译者:叹气~)。详情请参考最新的苹果开发者文档 iOS App Programming GuideiOS Human Interface Guidelines 。从官方文档中,我找出来针对新iPad的Retina显示屏我们需要准备的东西:

iPad主应用图标 (144×144像素):之前用在iPad 1、2代上的是72×72 像素。现在我们需要额外的@2x版本(144×144 像素)。

iPad搜索结果图标 (100×100像素):这个图标出现在系统搜索结果中(译者注:还有在系统设置中,如果应用支持的话)。之前版本用的是50×50像素,现在@2x版本需要100×100像素。

文件命名和Info.plist文件

根据你的应用需要支持的iOS最低版本不同,你可能需要在Info.plist文件中指定图标文件名,或者是按照苹果的规范命名不同版本的主图标文件。最悲催的情况恐怕就是,你搞的是一个即可跑在iPhone也可跑在iPad上的通用应用(universal app),并且你打算支持iOS 3.1.x甚至更早的版本(译者:其实现在iOS 4.0及以上版本的设备普及率已经很高了,完全没有必要支持古董级的版本,咱又不是Android)。因为iOS 3.2之前是不支持在Info.plist文件里面指定图标文件的,所以你得使用苹果指定的规范去命名图标文件。一个完整的列表差不多就是下面这个样子:

● Icon.png – 57×57 iPhone应用图标

[email protected] – 114×114 iPhone Retina显示屏应用图标

●Icon-72.png – 72×72 iPad应用图标

[email protected] - 144×144 iPad Retina显示屏应用图标

●Icon-Small.png – 29×29 iPhone 系统设置和搜索结果图标

[email protected] – 58×58 iPhone Retina显示屏 系统设置和搜索结果图标

●Icon-Small-50.png – 50×50 iPad 系统设置和搜索结果图标

[email protected] – 100×100 iPad Retina显示屏 系统设置和搜索结果图标

如果你的应用仅兼容iOS 3.2及之后的版本,那么你可以在Info.plist文件里面指定图标文件,你不用遵守上面的命名规范,当然你非要那么命名也没有问题(译者:为了便于和美工沟通和日后项目资源的管理,还是建议遵循这套规范)。在iOS 3.2中,苹果在Info.plist文件中引入了CFBundleIconFiles键,在此其中你可以直接指定应用图标的各种版本。如果你忽略了.png的后缀名,那么你也可以忽略高分版本图片的@2x部分,系统会自动匹配。

苹果在iOS 5.0中为了支持报刊杂志(Newsstand)功能,再次引入了一个新的键 CFBundleIcons,这让事情变得更加复杂起来( 译者:再次叹气~)。这个键下含有子键CFBundlePrimaryIcon,里面的CFBundleIconFiles子键保存着在此之前保存在Info.plist根节点CFBundleIconFiles键里面的内容。如果你的应用仅支持iOS 5.0及之后版本,那么用一个 CFBundleIcons键就可以,否则的话你还需要同时保留CFBundleIconFiles键和相关内容。

(译者:这里原文讲述稍微有点偏差,未提到CFBundlePrimaryIcon,而且比较混乱,令人费解。其实在Xcode里面以默认方式打开Info.plist看到的会是Icon Files和Icon Files(iOS 5)两组键)

总之,为了做到向后兼容,这个环节会给开发者带来一点小混乱,相当容易犯错。所以,建议开发者针对不同的设备、屏幕组合多做测试。

三、应用商店截屏图片

苹果近期对应用提交做出了规则调整,如若是iPhone、iPod touch应用,必须提交Retina显示屏高分版本的应用屏幕截图。具体图片尺寸要求如下 (前面的尺寸是含系统状态栏情况下的截图):

- 横屏: 960×640 或 960×600

- 竖屏: 640×960 或 640×920

目前苹果尚未对iPad应用提交也做出类似要求,但是为了让你的应用截图在新iPad上看起来呼之欲出,现在是时候考虑使用高分版本截图了。对应的截图尺寸如下 (前面的尺寸是含有状态栏情况下的截图):

- 横屏: 2048×1536 或 2048×1496像素

- 竖屏: 1536×2048 或 1536×2008像素

译者注:原文评论中有人做了补充的,运行时的载入画面,针对新iPad屏幕也需要准备,文件命名和尺寸要求:

- 横屏: Default-Landscape@2x~ipad.png (2048×1496像素)

- 竖屏: Default-Portrait@2x~ipad.png (1536×2008像素)

关于译(作)者:
陈远:独立移动应用开发者,关注 iOS 及 Mac 应用、Ruby on Rails、用户体验设计。拖家带小的30+ 程序员需要探索一个适合自己的生活方式。(新浪微博: @chrischen79

正在加载推荐文章
一位父亲对幼儿iPad应用开发者的告白
盘点可在新iPad呈现极佳视觉效果的11款应用
Facebook iPad应用曝光
iPad应用的十大用户体验设计准则
iPad必备学习应用推荐
无觅相关文章插件,快速提升流量

[ comments ]

相关 [应用 ipad retina] 推荐:

让你的应用支持新iPad的Retina显示屏

- - 酷勤网-挖经验 [expanded by feedex.net]
上周起大家伙纷纷开始上手第三代iPad了. 由于新iPad采用了Retina显示屏,分辨率较上一代iPad增加了一倍(译者:长宽增加一倍,像素是上一代的四倍). 为了支持新增的这些个像素,iOS开发者需要考虑升级自己的iPad应用,我在下文列举了一些必须注意的事项. 标准iOS控件里的图片资源,苹果已经做了相应的升级,我们需要操心的是应用自己的图片资源.

Retina Macbook Pro 必备应用

- - 极客公园-GeekPark
[核心提示]MacBook Pro with Retina 用户必备应用来完美体验 Retina 屏幕的效果. 继 Retina 登陆 iPad 后,视网膜屏幕终于如大家所期盼 预料的那样登陆上了 MacBook Pro,先是 15' MacBook Pro with Retina 后是 13' MacBook Pro with Retina,搭配 Retina 的 Mac 笔记本逐渐到了越来越多的用户手里.

权英秀:“Retina 屏幕已经用在 iPhone 和 iPad 上”,这是说漏嘴?

- Leonhard - 爱范儿 · Beats of Bits
下一代 iPad 即将搭载 Retina 屏幕的消息由来已久,而且还出现了 iPad Pro ,iPad HD 和 iPad 3 这种煞有介事的型号. LG Display 的 CEO 权英秀(Kwon Young-soo)日前在接受 Korean Times 采访时对三星的 OLED 产品不屑一顾,他认为 OLED 产品并不适合面积较小的手持设备,特别是手机和平板电脑.

预测:苹果电视配备Retina显示屏 支持应用程序

- xing - cnBeta.COM
根据最新的调查,到2015年,47%的平板电视将会带有网络连接功能,但是用户仍智能在家才能连接到网络,而苹果则将会进军这个领域. 目前仅有40%的电视可以和网络连接. 无疑这是一个好机会,相信苹果会利用这个机会在明年揭幕旗下的HDTV系列产品.

Facebook iPad应用曝光(图)

- Brant - 36氪
Facebook实际上已经有iPad应用了,就隐藏在iPhone应用的代码中. MG Siegler已经用了一个晚上了. 他说感觉还不错,虽然Facebook最终发布该应用时不一定跟他现在用的一样,但至少他觉得这个应用的感觉是对的. 据MG的几个消息来源称,他们已经看过这个应用,并且这就是Facebook近期打算发布的.

iPad应用的敏捷设计流程

- Xiujun Ma - 最新文章 - UCD大社区
Sarah Parmenter在访谈中介绍了她在设计列车时刻表app时的流程和设计原则. 对设计师来说,iPhone和iPad是全新的平台. 相比图形和网站设计的经验积累,在iPhone和iPad上的设计进化还都处于萌芽期. 在这里,Sarah跟大家分享了简单明了的火车时刻表软件设计流程和基本原则,可能对你自己的设计项目有所启发.

iPad必备学习应用推荐

- kevin li - 褪墨
本文来自网络上的复旦大四老人经验贴:给大学生们的iPad应用推荐. 去年的差不多这个时候,hurry off到温哥华的我十分兴奋地去Pacific Center买了iPad(当然,是第一代的). 由于当时本人是以“提高工作效率”为理由给自己买的iPad,所以在接下来的一年间,本人以无比执着的态度持续跟踪iTunes美国店的优秀应用(跟踪美国店是因为美国店的用户评级以及评论信息最多,所以应该最有参考价值).

iPad关键应用选购指南 (3)

- Smilebox - 战隼的学习探索
iPad关键应用选购指南 (1). iPad关键应用选购指南 (2). 摆脱MP4的局限,播放任何格式的视频. 由于各种播放器放视频时候都一个模样,就分别都只发操作界面的截图了,节省版面. 免费推荐:Oplayer Lite. 能播720P及以下的主流格式视频,如MKV, RMVB等等等. 可以用iTunes或wifi传输视频到iPad上.

iPad关键应用选购指南 (1)

- 雨从心流过 - 战隼的学习探索
这段时间刚入手IPAD2,在收集一些技巧和软件,这篇文章是我目前找到写得最好的,跟 Liyn写的 Iphone非娱乐功能应用指南(2011年国庆更新版) 有同样的效果,可以更好的发挥iPad的作用. 再一次感谢Liyn和yyh1002,因为你们的不断研究和分享帮助更多的人把iPhone和iPad使用的更有效率.

iPad关键应用选购指南 (2)

- 云飞风起 - 战隼的学习探索
画画是平板电脑最独特的功能之一. 有了好的手写笔的话,iPad画画还是很给力的. 免费推荐:Sketchbook Express. 设计类软件巨头Autodesk出品,是iPad最流行绘画应用Sketchbook Pro的缩减版. 很成熟的应用,免费有15种画笔,功能较全,手感不错,能满足基础绘画的要求.