对于设计师而言，务必要清楚：iPhone XS、XS Max 以及 XR 的适配尺寸

对于 UI 设计师而言，New iPhone 所产生的影响不容小觑，因为这一次苹果为我们增添了两种全新的设计尺寸：

iPhone XS，1242 x 2688，@3x

iPhone XR，828 x 1792，@2x

在探讨新机器的适配问题之前，我们需要明确一个前提，以防造成认知上的混乱。

适配主要关注三个参数：

渲染像素——屏幕截图的图片尺寸，单位为 px

逻辑像素——程序员进行开发时所采用的尺寸，单位为 pt

倍率——通过渲染像素除以逻辑像素所得的倍数关系，常见的倍率有@2x、@3x。倍率决定了切图。

网络上存在众多有关适配的帖子，常常会涉及到：屏幕尺寸、PPI、DPI 等与适配无关的概念。这些不仅无助于新人理解适配，反而会让读者绕弯路。

首先，让我们来了解一下这三款机型的屏幕参数。

iPhone XS

其分辨率为 1125 X 2436px ，ppi 为 458

iPhone XS Max

分辨率为 1242 x 2688px ，ppi 为 458

iPhone XR

分辨率为 828 X 1792px ，ppi 为 326

从 ppi 来看，值得庆幸的是，一切都还是熟悉的模样，这意味着切图的倍数并未发生变化。iPhone XS 和 XS Max 与 iPhone X 相同，ppi 均为 458，所以依旧采用 3 倍切图@3x 即可！iPhone XR 则与 iPhone 6/7/8 一致，ppi 为 326，因而采用 2 倍切图@2x 。

在切图方面没有过多的困扰，接下来看看新尺寸对设计布局产生的影响。

首先我们观察一下新机型的逻辑像素（pt）尺寸（也就是密度无关像素尺寸）

iPhone XS：分辨率除以 3，即 375 x 812pt，所以其布局与 iPhone X 完全相同；

iPhone XS Max： 分辨率除以 3， 即 414 x 896pt；

iPhone XR：分辨率除以 2，即 414 x 896pt。

也就是说，实际上只是新增了一个尺寸 414 x 896pt，而且 XS Max 和 XR 均为全面屏，需要预留出安全区域。

因此，如果您是以 iPhone 8 （375x667pt） 为基准来制作 XS Max 和 XR 的设计稿，那么就将尺寸拉伸加宽至 414 x 896， 然后将状态栏从 20pt 变更为 44pt，并添加 34pt 的底部主页指示器。

倘若您是以 iPhone X (375×812) 为基准来制作 XS Max 和 XR 的设计稿，仅需将尺寸拉伸加宽至 414 x 896，状态栏和底部主页指示器均无需更改。

而后续有关图片等元素的适配，就需要从视觉层面进行灵活的调整了。

不过，对于尺寸的计算和安全区域的设置，如今您完全无需手动操作，墨刀已经率先迅速为大家推出了 XS/ XS Max 和 XR 的适配，只需一键创建 XS/ MAX/ XR 项目即可！状态栏和底部主页指示器已经静静地为您准备好以供使用！

在创建项目时，直接选择“iPhone XS Max 和 XR”的尺寸

无论是从 Sketch 导入基准设计稿并稍作调整，还是在墨刀完成全新的设计，

点击“预览”，便能展示出 XS/ XS Max 和 XR 的效果！