2020年10月14日4款iPhone如期发布，比起4款新iPhone想必各位UI设计师最关心的是今年的机型大小有没有变，还能不能用以往的750x1334px（375x667pt）进行设计开发了？如果变了哪该如何适配？到底有没有那些人说的4倍图？不急我们一一道来：
我们知道在以往的APP设计开发中，大家基本以iPhone6、7、8的750x1334px（375x667pt）这尺寸进行。自去年iPhone 11 pro推出后部分同学也开始用1242x2208px设计。那今年出的这4款我们先看下新的尺寸分辨率。
iPhone 12/iPhone 12 Pro
与iPhone 11 Pro对比
从页面像素对比来看：
iPhone 12 Pro
逻辑像素宽度1170/3=390pt
高度2532/3=844pt
iPhone 11 Pro
逻辑像素宽度1125/3=375pt
高度2436/3=812pt
小结：iPhone 12 Pro宽比iPhone 11 Pro多15pt，垂直方向上的显示内容多了32pt，有些类似于iPhone 5和iPhone 6的适配方式。
由此可看出，iPhone 12 mini（1080*2340px）的PPI是476ppi，与iPhone 11 Pro（三倍图）的458ppi相差不大，同样都采用了超视网膜 XDR 显示屏，我们可以推论出它们使用的也都是三倍图@3x，并非网传的4倍图。
从页面宽高比例来看：
iPhone 12 mini
逻辑像素宽度是1080/3=360pt，高度是2340/3=780pt。
iPhone 11 Pro
逻辑像素宽度是1125/3=375pt，高度是2436/3=812pt。
小结：iPhone 12 mini宽度比iPhone 11 Pro少15pt，垂直方向上的显示内容少了32pt。
最后看下iPhone 12 Pro Max（1284*2778px）的PPI是458ppi对角线6.7英寸的，与iPhone 11 Pro（三倍图）的458ppi相同，都采用了超视网膜 XDR 显示屏，我们可以推论出它们使用的都是三倍图@3x。（也可以用iPhone 11 Pro Max与之对比）
从页面宽高比例来看：
iPhone 12 Pro Max
逻辑像素宽度1284/3=428pt
高度是2778/3=926pt
iPhone 11 Pro
逻辑像素宽度1125/3=375pt
高度是2436/3=812pt
iPhone 12 Pro Max
宽度比iPhone 11 Pro多53pt，垂直方向上的显示内容多了114pt。
小结一下
iPhone 12 mini、iPhone 12、iPhone 12 Pro、iPhone 12 Pro Max都是三倍图@3x；适配方法与早期的iPhone 5适配iPhone 6类似，并且由于都是全面屏，理解起来应该是比较简单的。
以适配iPhone 12为例，简单说下
假如我们以iPhone 11 Pro（375*812pt）为基准做设计稿，需要调整到iPhone12的@3x图，这里直接将画板拉宽到390pt x 844pt即可，状态栏、导航栏、标签栏、主页指示器的高度不用变，剩下的就是微调页面（等比缩放、控件弹性调整、文字自适应）下面我们再复习一下之前文章说的适配三原则↓↓↓
在适配的时候通常会遵循三个适配原则：
等比缩放、弹性控件、文字流自适应
等比缩放
等比缩放指的是该元素的尺寸大小并不是固定的，是会跟随着屏幕的大小（一般是宽度）变化而变化。如下图 App Store 的搜索结果页，单个预览图的比例是16:9，不管屏幕分辨率如何变化，图片比例并不会发生变化，有多大拉多或等比缩小。
标注的时候，我们也只需要标注好页边距、图片比例、图片之间的间距就好，开发就可以把适配规则写成随屏幕宽度变化而变化。
弹性控件
弹性控件指的是元素尺寸不变，间距随着屏幕的宽度自适应，屏幕越宽，间距越大，说人话就是大小不变，两边拉开。
文字流自适应
一行文字的数量多少和屏幕宽度成正比，屏幕越宽，一行能显示的文字数量也就越多。所以我们在开始设计时候就应该以文本框形式去做，有助我们后期做适配！
后面给大家附上一张往期iPhone尺寸对照图，方便大家工作、学习时候自查对比。
联系客服
