Skip to content

Latest commit

 

History

History
155 lines (97 loc) · 9.44 KB

iosScreen.md

File metadata and controls

155 lines (97 loc) · 9.44 KB
Raw

名词解释

  • 屏幕尺寸：即屏幕对角线的长度，单位为英寸（Inch），1英寸等于2.54厘米；

  • 逻辑分辨率：是印刷行业常用的单位，1pt等于1/72英寸，是实际的物理长度；

  • 分辨率：1px就是一个点，它不能表示长度，点可以做大做小，长度自然也不一致，相同屏幕尺寸下，分辨率越高，屏幕的细腻程度越高；

  • PPI：Pixels Per Inch，每英寸像素，即像素密度，PPI越高，图片的细腻程度越高。

  • 对比度：指的是一幅图像中明暗区域最亮的白和最暗的黑之间不同亮度层级的测量，差异范围越大代表对比越大，差异范围越小代表对比越小。

  • 色域：色域是对一种颜色进行编码的方法，也指一个技术系统能够产生的颜色的总和。简单来说就是在色彩中能覆盖到的面积。色域又被称作“色彩空间”（英文名：colorspace）。

苹果手机屏幕参数与分析

参数

手机 屏幕尺寸 逻辑分辨率(pt) Render 分辨率(px) PPI 渲染分辨率 对比度
iPhone3GS 3.5 320x480 @1x 320x480 163 200:1
iPhone4/4s 3.5 320x480 @2x 640x960 330 800:1
iPhone5/5s/5c 4.0 320x568 @2x 640x1136 326 800:1
iPhoneSE 4.0 320x568 @2x 640x1136 326 800:1
iPhone6 4.7 375x667 @2x 750x1334 326 1400:1
iPhone6s 4.7 375x667 @2x 750x1334 326 1400:1
iPhone7 4.7 375x667 @2x 750x1334 326 1400:1
iPhone8 4.7 375x667 @2x 750x1334 326 1400:1
iPhone6Plus 5.5 414x736 @3x 1080x1920 401 1242x2208 1300:1
iPhone6sPlus 5.5 414x736 @3x 1080x1920 401 1242x2208 1300:1
iPhone7Plus 5.5 414x736 @3x 1080x1920 401 1242x2208 1300:1
iPhone8Plus 5.5 414x736 @3x 1080x1920 401 1242x2208 1300:1
iPhoneXR 6.1 414x896 @2x 828x1792 326 1400:1
iPhoneX 5.8 375x812 @3x 1125x2436 458 1000000:1
iPhoneXs 5.8 375x812 @3x 1125x2436 458 1000000:1
iPhoneXs Max 6.5 736x1344 @3x 1242x2688 458 1000000:1
iPhone11 6.1 414x896 @2x 828x1792 326 2000000:1
iPhone11 Pro 5.8 375x812 @3x 1125x2436 458 2000000:1
iPhone11 Pro Max 6.5 736x1344 @3x 1242x2688 458 2000000:1
iPhone12 6.1 390x844 @3x 1170x2532 460 2000000:1
iPhone12 Mini 5.4 360x780 @3x 1080x2340 476 2000000:1
iPhone12 Pro 6.1 390x844 @3x 1170x2532 460 2000000:1
iPhone12 Pro Max 6.7 428x926 @3x 1284x2778 458 2000000:1
iPhone13 6.1 390x844 @3x 1170x2532 460 2000000:1
iPhone13 Mini 5.4 360x780 @3x 1080x2340 476 2000000:1
iPhone13 Pro 6.1 390x844 @3x 1170x2532 460 2000000:1
iPhone13 Pro Max 6.7 428x926 @3x 1284x2778 458 2000000:1

图片

数学公式

结合上面的表格，我们来分析这些数据的关系。

  • 1pt长度

)

  • 屏幕尺寸，其中sInch为屏幕尺寸，wInch和hInch分别是屏幕的真实高度

  • PPI（其中wpx和hpx为分辨率的宽高，sInch是屏幕尺寸）

以iPhone3GS为例：sqrt(320^2+480^2)/3.5 = 164.825201164068082，约等于官方提供的163

  • 实际场景

pt为开发者常用的尺寸，px为设计师常用的尺寸

特殊场景

iPhone多数机型，pt * render = px，但是在 iPhone(n) Plus机型中，则不是这样，我们以 iPhone6 Plus的为例：

宽：414 * 3 = 1242

高：736 * 3 = 2208

1、从上面的计算我们得到，iPhone6 Plus的分辨率应该是 1242x2208 才对，但实际上iPhone6 Plus的实际分辨率仅仅只有 1080x1920（我们常说的1080P）。这应该是苹果公司基于成本的考虑，没有使用 1242x2208 分辨率的屏，因为这样的话，对屏幕的PPI要求将高达 461，我们看到通代的 iPhoneX 的 PPI 也只有 458。

2、所以苹果做了这样一个处理，为了让开发容易上手，iPhone6 Plus仍然按照3倍设计图片，屏幕在显示之前，先对高像素的图片进行缩放，将 1242x2208 抽样缩放到 1080x1920，然后渲染到 1080x1920 的屏幕上。由于多了这一步的操作，iPhone6 Plus 提高了GPU的压力，也增加了功耗，再配上iOS8系统，时常会出现卡顿。

关键参数

对比度

1、对比度对视觉效果的影响非常关键，一般来说对比度越大，图像越清晰醒目，色彩也越鲜明艳丽；而对比度小，则会让整个画面都灰蒙蒙的。

2、好的对比率120:1就可容易地显示生动、丰富的色彩，当对比率高达300:1时，便可支持各阶的颜色。我们从下表中看到，苹果从iPhoneX时，采用OLED屏幕，对比度有了极大的提高。

色域

CIE1931色域坐标

在颜色感知的研究中，CIE 1931 XYZ色彩空间（也叫做CIE 1931色彩空间）是其中一个最先采用数学方式来定义的色彩空间，它由国际照明委员会（CIE）于1931年创立。 image

几个重要的标准：

  • sRGB

色域覆盖率：就是可以显示的颜色对sRGB颜色的覆盖率，这个不可能超过100%，市面上比较多的是99%。色域覆盖率越大，说明缺失的颜色越少。

色域容积：是可显示的颜色区域跟sRGB颜色区域的比值，这个可以超过100%，现在市面上说的120% sRGB，说的就是色域容积。

image

如果一款显示器的标注的色域为“99% sRGB”，而且没有说明是覆盖率还是容积，这时候就很难判断这个99%到底是什么，如果只是99% sRGB色容积，那sRGB覆盖率可能很低。一般来说，对于一台真正能够做到99% sRGB色域覆盖率的显示器，都会明确标注“99% sRGB色域覆盖率”，没有必要故意隐去“覆盖率”这三个字。

  • Adobe RGB 待补充

  • NTSC 待补充

  • EBU 待补充

过滤蓝光

待补充

兼容性测试

手机（下列出现多台的情况，购买任意一台就够了） 屏幕尺寸 逻辑分辨率(pt) Render 分辨率(px) PPI 系统版本（非常重要） 采购原因
iPhone6s 4.7 375x667 @2x 750x1334 326 iOS10 系统兼容性
iPhoneX、iPhoneXs、iPhone11 Pro 5.8 375x812 @3x 1125x2436 458 iOS11 系统兼容性
iPhoneXr、iPhone11 6.1 414x896 @2x 828x1792 326 iOS12 系统兼容性
iPhoneXs Max、iPhone11 Pro Max 6.5 736x1344 @3x 1242x2688 458 iOS13 系统兼容性
iPhone12、iPhone12 Pro、iPhone13、iPhone13 Pro 6.1 390x844 @3x 1170x2532 460 iOS14 系统兼容性
iPhone12 Mini、iPhone13 Mini 5.4 360x780 @3x 1080x2340 476 iOS14 显示兼容性
iPhone12 Pro Max、iPhone13 Pro Max 6.7 428x926 @3x 1284x2778 458 iOS15 系统兼容性
iPhone6（开发手上现有） 4.7 375x667 @2x 750x1334 326 iOS12 开发要用
iPhone7Plus（开发手上现有） 5.5 414x736 @3x 1080x1920 401 iOS15 开发要用

参考文档： https://baike.baidu.com/item/%E5%AF%B9%E6%AF%94%E5%BA%A6/1196082

https://zhuanlan.zhihu.com/p/166413369

https://zhuanlan.zhihu.com/p/45196173

https://zh.wikipedia.org/wiki/CIE_1931%E8%89%B2%E5%BD%A9%E7%A9%BA%E9%97%B4