最新的iPhone点和像素

从初代iPhone 到 iPhone 3GS,iPhone系列坚守 320 x 480 像素。开发人员采用绝对定位及像素模式进行处理。但是 iPhone 4之后就发生了改变,iPhone 4 采用Retina显示屏。即当前物理尺寸不变,但像素成倍增加,变成了640x960像素。

为了避免同行出现的大坑(屏幕适配难),苹果对开发人员提出了point (点) 的概念。(以一维方式进行探究)

1 在iPhone 3GS中, 1 个点 等于 1 个像素

2 在以后的设备中(非iPhone 6+/6s+/7+/8+/X) ,1个点等于2个像素 

3 iPhone 6+/6s+/7+/8+/X 中 ,1个点等于3个像素

这样用户在使用iPhone4 的时候,会感觉比iPhone 3GS 更加细腻。

由此,我们需要对市面上的一些单位及术语进行相关的总结:

1 英寸: 作为手机屏幕对角线的物理长度的单位。如 iPhone 8 Plus 为5.5英寸。

2 像素: 可以想象成屏幕上真正用来显示颜色的发光小点。如 iPhone 8 Plus 为 1080x1920 像素。

3 点:    针对开发人员,开发App时候用的单位,是一个虚拟的单位,用于屏蔽各个设备屏幕像素的不同,兼容以前的程序。

4 ppi(pixel per inch): 每英寸有多少个像素。 iPhone 4 的屏幕是  640x960像素,3.5英寸。那么根据勾股定理,对角线应该有 1154个像素,转换一下也就是 1154/3.5 = 330pi, 官方给出的数字是 326 ppi。

5 Retina屏: Retina翻译过来是视网膜。当像素太密超过 300ppi的时候,人眼就不能够区分出每个像素,因此 iPhone 4以后的屏幕都是Retina屏。

6 文字、颜色等矢量数据 放大是不会失真的。但是图片并非矢量数据,直接使用会产生问题。因此苹果对它采用不同的处理方式。

假设example.png 为 30x40 像素 (这里的单位为像素,数字图片的单位基本都为像素)。当example.png在 iPhone 3GS和 iPhone 4中使用的时候,都占据屏幕30x40个点。而iPhone 4中 1 个点等于 2 个像素,也就是30x40像素的图片,占据了60x80 像素的屏幕,因此这图片在iPhone 4中看起来会模糊。

为了对图片进行适配,需要准备三张内容相同的图片,放在同一目录下。

example.png             // 30x40 像素

[email protected]      // 60x80 像素

[email protected]      // 90x120 像素 

当程序中使用图片时,会根据屏幕模式自动选择对应的图片。 屏幕1x模式,就会选择example.png。 2x就会优先选择[email protected],假如[email protected]不存在时,就会降级选择example.png。屏幕3x模式同理屏幕2x模式的降级选择。


附表 (至2017-11-06以来,iPhone 系列设备参数表)

最新的iPhone点和像素_第1张图片

(注: iPhone 6+/6s+/7+/8+ 渲染像素与设备分辨率不一致,iPhone 3GS/6+/6s+/7+/8+/X除外,其他所有iPhone的ppi是一致的,都是326,用@2x的素材。

但是6+/6s+/7+/8+的实际ppi是401,理论上苹果应该用401/326 * @[email protected]的素材。但是这个奇葩的比例对UI美工而言很难切图。所以苹果为方便开发者用的是@3x的素材,然后再缩放到@2.46x上,实际上是缩放到2.46/3=83%。实际上苹果选取了一个接近比例的87%。

这样算下来,物理分辨率和虚拟分比率的比例是87%,也就是1920/0.87=2208,1080/0.87=1242 。

好处就是开发者更方便,比如准备素材时,字号可以直接调成3x的。)

iPhone 记录之 点与像素

你可能感兴趣的:(最新的iPhone点和像素)