ios 比较两个点苹果两个点

转载

我心依旧 2023-08-26 14:10:57

文章标签 ios 比较两个点点像素 ppi 英寸 文章分类 iOS 移动开发

简述

为了避免 Android 设备的适配大坑，苹果提供一套适配自家产品不同尺寸的方案，让我们来探究一下像素与点的关系吧。

探究

从初代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个像素

这样用户在使用iPhone 4 的时候，会感觉比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 像素

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

example@3x.png // 90x120 像素

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

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

机型	屏幕宽高(点)	屏幕宽高(渲染像素)	设备分辨率	屏幕模式	屏幕精度(ppi)	屏幕对角线长度
iPhone 3GS	320 x 480	320 x 480	320 x 480	@1x	162	3.5 英寸
iPhone 4	320 x 480	640 x 960	640 x 960	@2x	326	3.5 英寸
iPhone 4s	320 x 480	640 x 960	640 x 960	@2x	326	3.5 英寸
iPhone 5	320 x 568	640 x 1136	640 x 1136	@2x	326	4.0 英寸
iPhone 5s	320 x 568	640 x 1136	640 x 1136	@2x	326	4.0 英寸
iPhone 5c	320 x 568	640 x 1136	640 x 1136	@2x	326	4.0 英寸
iPhone 6	375 x 667	750 x 1334	750 x 1334	@2x	326	4.7 英寸
iPhone 6 Plus	414 x 736	1242 × 2208	1080 x 1920	@3x	401	5.5 英寸
iPhone 6s	375 x 667	750 x 1334	750 x 1334	@2x	326	4.7 英寸
iPhone 6s Plus	414 x 736	1242 × 2208	1080 x 1920	@3x	401	5.5 英寸
iPhone 7	375 x 667	750 x 1334	750 x 1334	@2x	326	4.7 英寸
iPhone 7 Plus	414 x 736	1242 × 2208	1080 x 1920	@3x	401	5.5 英寸
iPhone 8	375 x 667	750 x 1334	750 x 1334	@2x	326	4.7 英寸
iPhone 8 Plus	414 x 736	1242 × 2208	1080 x 1920	@3x	401	5.5 英寸
iPhone X	375 x 812	1125 x 2436	1125 x 2436	@3x	458	5.8 英寸
iPhone Xs	375 x 812	1125 x 2436	1125 x 2436	@3x	458	5.8 英寸
iPhone Xs Max	414 x 896	1242 x 2688	1242 x 2688	@3x	458	6.5 英寸
iPhone XR	414 x 896	828 x 1792	828 x 1792	@2x	326	6.1 英寸

iPhone SE	320 x 568	640 × 1336	640 x 1336	@2x	326	4.0 英寸
iPhone SE(2)	375 x 667	750 x 1334	750 x 1334	@2x	326	4.7 英寸
iPhone 11	414 x 896	828 × 1792	828 x 1792	@2x	326	6.1 英寸
iPhone 11 Pro	375 x 812	1125 x 2436	1125 x 2436	@3x	458	5.8 英寸
iPhone 11 Pro Max	414 x 896	1242 × 2688	1242 x 2688	@3x	458	6.5 英寸
iPhone 12 mini	360 x 780	1080 x 2340	1080 x 2340	@3x	476	5.4 英寸
iPhone 12	390 x 884	1170 x 2532	1170 x 2532	@3x	460	6.1英寸
iPhone 12 Pro	390 x 884	1170 x 2532	1170 x 2532	@3x	460	6.1 英寸
iPhone 12 Pro Max	428 x 926	1284 x 2778	1284 x 2778	@3x	458	6.7 英寸