之前寫的文章《從第一代 iPhone 細(xì)數(shù)到 iPhone 12，iPhone 屏幕尺寸進(jìn)化歷程背后的 app 設(shè)計(jì)哲學(xué)》吸引了眾多對 iPhone 屏幕尺寸或者 對 app 適配感興趣的讀者，在文章發(fā)布的各個渠道，特別是在少數(shù)派引起了一番熱烈的討論。文章從設(shè)計(jì)、開發(fā)等多個角度講述了 iPhone 屏幕尺寸進(jìn)化歷程背后的 app 設(shè)計(jì)哲學(xué)，希望讀者能夠從我梳理的歷史脈絡(luò)和總結(jié)的進(jìn)化邏輯中獲得啟發(fā)。同時文章也順勢推測了未來 iPhone 特別是 iPhone 12 系列會出現(xiàn)的一些變化，這部分雖不是文章重點(diǎn)，但當(dāng)時處于在 iPhone 12 即將發(fā)布的時間點(diǎn)，自然也引起了眾多讀者的興趣。

如今，iPhone 12 、iPhone 12 Pro 系列正式發(fā)布，屏幕參數(shù)塵埃落定。對比之前文章對 iPhone 12 屏幕參數(shù)較為保守的推測，真正的 iPhone 12 屏幕參數(shù)變化可謂十分激進(jìn)。本文就作為之前文章的后續(xù)，基于之前文章所講的 iPhone 屏幕尺寸的進(jìn)化邏輯，來復(fù)盤一下 iPhone 12 的屏幕參數(shù)到底是如何變化的，對于普通用戶在 iPhone 12 上使用 app 又有什么影響。

如果你還沒有閱讀過之前的文章，強(qiáng)烈推薦你先閱讀，否則本文中的提到到的一些概念你可能會云里霧里😜

iPhone 12 系列屏幕的變化

iPhone 12 系列包括 6.1 寸 iPhone 12 機(jī)型和 5.4 寸 iPhone 12 mini 機(jī)型，全部配備 OLED 屏幕。

6.1 寸 iPhone 12

6.1 寸 iPhone 12 的屏幕分辨率為 1170px × 2532px，PPI 為 460，與 6.1 寸 iPhone 11 的屏幕分辨率（828px × 1792px）并不相同。在之前文章也有講到過，雖然是相同尺寸，但屏幕由 LCD 材質(zhì)換為 OLED 材質(zhì)，由于成像原理的不同，要想保持同樣的清晰度觀感，分辨率必須提升。 6.1 寸 iPhone 12 的邏輯分辨率為 390pt × 844pt，比例因子為 @3x。Apple 為了保證在屏幕尺寸稍有變大的情況下，PPI 不降低，沒有妥協(xié)繼續(xù)使用 375pt 的邏輯分辨率寬度，而是啟用了全新的邏輯分辨率寬度「390pt」，僅僅增加了 15pt。由邏輯分辨率寬度為 375pt × 812pt 的 5.8 寸 iPhone 11 Pro 進(jìn)化到邏輯分辨率寬度為 390pt × 844pt 的 6.1 寸 iPhone 12，兩者的寬高比例仍然保持相同，所以其變化邏輯仍然采用了之前文章總結(jié)的「等比放大」方法。

既然出現(xiàn)了全新的邏輯分辨率寬度，那 app 要完美運(yùn)行在新的機(jī)型中就需要進(jìn)行適配。沒有適配新機(jī)型的 app 將以 375pt × 812pt@3x（同 5.8 寸 iPhone 11 Pro）的樣式放大顯示在 iPhone 12 上，相當(dāng)于把圖像放大了 1.04 倍，相比已經(jīng)適配的 app 看上去會有些模糊（具體觀感真機(jī)上手后再來補(bǔ)充）。App 要想適配新機(jī)型，至少需要通過 Xcode 12.1 及以上版本編譯 app，并根據(jù)實(shí)際情況調(diào)整適配 app 布局。

適配的速度就要看各位開發(fā)者了，比如下圖中的「我的天氣」app 在 iPhone 12 發(fā)售前就已經(jīng)完成了對 iPhone 12 系列的適配顯示。

5.4 寸 iPhone 12 mini

5.4 寸 iPhone 12 mini 的屏幕分辨率為 1080px × 2340px，PPI 為 476，清晰度位列 iPhone 12 系列第一名。 由 iPhone 12 mini 的屏幕分辨率除以比例因子 @3x 得到邏輯分辨率 360pt × 780pt，很多人自然而然地就會以為這就是 iPhone 12 mini 的邏輯分辨率。然而通過已經(jīng)發(fā)布的 Xcode 12.1 GM 版本的模擬器可以查到 iPhone 12 mini 的渲染分辨率（截圖的大小）實(shí)際為「1125px × 2436px」，比物理分辨率（屏幕的物理參數(shù)）放大了 1.04 倍。同當(dāng)年的 iPhone 6 Plus 一樣，Apple 再次使用了一樣的變化手法。 1125px × 2436px 的渲染分辨率對應(yīng)的邏輯分辨率為 375pt × 812pt@3x，正是之前 5.8 寸 iPhone 11 Pro 的邏輯分辨率，這樣 app 想完美運(yùn)行在 iPhone 12 mini 上就無需再進(jìn)行額外的適配工作。但由于像素不是點(diǎn)對點(diǎn)顯示的，顯示圖像可能會有不銳利的問題，但由于其高 PPI 的存在，這個感知不會明顯。

iPhone 12 Pro 系列屏幕的變化

iPhone 12 Pro 系列包括 6.1 寸 iPhone 12 Pro 機(jī)型和 6.5 寸 iPhone 12 Pro Max 機(jī)型。

6.1 寸 iPhone 12 Pro

6.1 寸 iPhone 12 Pro 與 6.1 寸 iPhone 12 的屏幕參數(shù)完全相同，屏幕分辨率為 1170px × 2532px，PPI 為 460，邏輯分辨率為 390pt × 844pt，比例因子為 @3x。 對于 app 適配 iPhone 12 Pro 的邏輯也與 iPhone 12 完全相同，在此不再贅述。

6.7 寸 iPhone 12 Pro Max

6.7 寸 iPhone 12 Pro Max 的屏幕分辨率為 1284px × 2778px，PPI 為 458。 6.7 寸 iPhone 12 Pro Max 的邏輯分辨率為 428pt × 926pt，比例因子為 @3x。同樣地，Apple 為了保證在屏幕尺寸稍有變大的情況下，PPI 不降低，沒有妥協(xié)繼續(xù)使用 414pt 的邏輯分辨率寬度，而是啟用了全新的邏輯分辨率寬度「428pt」，僅僅增加了 14pt。由邏輯分辨率寬度為 414pt × 896pt 的 6.5 寸 iPhone 11 Pro Max 進(jìn)化到邏輯分辨率寬度為 428pt × 926pt 的 6.7 寸 iPhone 12 Pro Max，兩者的寬高比例仍然保持相同，所以其變化邏輯仍然采用了之前文章總結(jié)的「等比放大」方法。

對于 app 適配也是一樣，app 要完美運(yùn)行在新的機(jī)型中就需要進(jìn)行適配。沒有適配新機(jī)型的 app 將以 414pt × 896pt@3x（同 6.5 寸 iPhone 11 Pro Max）的樣式放大顯示在 iPhone 12 Pro Max 上，相當(dāng)于把圖像放大了 1.03 倍，相比已經(jīng)適配的 app 看上去會有些模糊（具體觀感真機(jī)上手后再來補(bǔ)充）。App 要想適配新機(jī)型，至少需要通過 Xcode 12.1 及以上版本編譯 app，并根據(jù)實(shí)際情況調(diào)整適配 app 布局。

放大顯示功能

在之前文章中有講到目前大部分的 iPhone 機(jī)型都配備了放大顯示功能，關(guān)于放大顯示最重要的一點(diǎn)就是，其實(shí)質(zhì)是將高一級的邏輯分辨率降級到同一比例的低一級的邏輯分辨率。 在 iOS 14 Beta 版本中開始出現(xiàn)了 5.8 寸 iPhone 11 Pro（ 375pt × 812pt@3x）的放大顯示功能，其邏輯分辨率為 320pt × 693pt@3x，當(dāng)時的推測是這很可能是 5.4 寸 iPhone 12 mini 的真正分辨率。然而現(xiàn)實(shí)情況是這只是 Apple 虛構(gòu)的一個機(jī)型分辨率，至少在現(xiàn)在這個時間點(diǎn)，這個機(jī)型是不存在的，當(dāng)我確定這個結(jié)論時也是十分詫異。

那這個虛構(gòu)的邏輯分辨率又用在了哪些地方呢？具體來看： 在有了這個虛構(gòu)的邏輯分辨率 320pt × 693pt 之后，5.8 寸的 iPhone 11 Pro、iPhone iPhone Xs、iPhone X 機(jī)型自然就支持了放大顯示功能。

但由于這個 320pt 的全面屏邏輯分辨率寬度不存在于任何一個現(xiàn)有的機(jī)型，要想 app 正常運(yùn)行在這個邏輯分辨率之下，也得需要進(jìn)行適配。如果不進(jìn)行適配，將會以 iPhone 5s 的大小顯示，也即上下有黑邊。

再來看全新的 iPhone 12 系列的放大顯示，6.7 寸的 iPhone 12 Pro Max 開啟放大顯示后，會降級到 375pt 寬度，也即 iPhone 11 Pro 大?。?.1 寸 iPhone 12/iPhone 12 Pro 、5.4 寸 iPhone 12 mini 開啟放大顯示后，都會降級到 320pt 寬度，也即前面提到的虛構(gòu)機(jī)型的大小，如果 app 沒有適配全面屏的 320pt 邏輯分辨率寬度，同樣會出現(xiàn)上下有黑邊的情況。

320pt（全面屏）這個新增的邏輯分辨率寬度隱藏在放大顯示功能背后，可能更不會引起 app 開發(fā)者的注意，適配的進(jìn)度可能會更慢。

內(nèi)容顯示數(shù)量

至此，iPhone 12 系列在標(biāo)準(zhǔn)顯示模式下新增了 390pt（iPhone 12/iPhone 12 Pro）、428pt（iPhone 12 Pro Max）兩種新的邏輯分辨率寬度，在放大顯示模式下新增了 320pt（iPhone 12/iPhone 12 Pro、iPhone 12 mini） 一種新的邏輯分辨率寬度?？偣苍黾恿?390pt、428pt、320pt（全面屏） 三種邏輯分辨率寬度。

邏輯分辨率的大小會決定屏幕上內(nèi)容顯示數(shù)量的多少。針對于不同邏輯分辨率的屏幕，下圖對比了其內(nèi)容顯示數(shù)量。幾個值得特別注意的點(diǎn)：

• 之前的 6.1 寸 iPhone 11 是 414pt 寬度，同 6.5 寸 iPhone 11 Pro Max 一樣，而 6.1 寸的 iPhone 12/iPhone 12 Pro 減少到了 390pt 寬度，相比于以前，橫縱向顯示數(shù)量變少了，但比例因子由 @2x 變?yōu)?@3x，總體上 PPI 也即清晰度大幅提升了。對于從 iPhone X?、iPhone 11 更新到 iPhone 12、iPhone 12 Pro 的用戶在初期可能會不適應(yīng)。
• 從 375pt 增加到 390pt，從 414pt 增加到 428pt，雖然橫縱向的確可以顯示更多的內(nèi)容，但對比發(fā)現(xiàn)后，其實(shí)差異不會很明顯。
• iPhone 12/iPhone 12 Pro、iPhone 12 mini 的放大顯示都是 320pt，很多 app 可能都沒有適配，而且整體承載內(nèi)容數(shù)量較少較擠，并不適合作為日常使用。

再附一張臺灣 iOS 開發(fā)者 @ethanhuang13 在 Xcode 模擬器使用不同機(jī)型顯示同一個網(wǎng)站上的內(nèi)容對比情況。

Size Class

Size Class 尺寸等級同樣是之前文章中所提到的 iPhone 尺寸變化過程中的一個重要概念。

全新的 iPhone 12 系列在豎屏下，毫無懸念，依然同其他 iPhone 一樣是「compact width，regular height」。但在橫屏下，有幾個需要注意的點(diǎn)：

• 6.1 寸的 iPhone 12/iPhone 12 Pro 系列由于其邏輯分辨率比 6.1 寸 iPhone 11 小一些，所以其橫屏的 Size Class 是 「compact width，compact height」，與 iPhone 12 mini、iPhone 11 一樣。因此在如「信息」這樣支持左右分欄布局樣式的 app 上顯示時就只能顯示某個聯(lián)系人的短信內(nèi)容，如下圖；
• 6.7 寸的 iPhone 12 Pro Max 其橫屏的 Size Class 自然是 「regular width，compact height」，與 iPhone 11、iPhone 11 Pro Max 一樣，在「信息」app 中可以分左右兩邊顯示短信列表和具體的短信內(nèi)容，如下圖。

總結(jié)

縱觀 iPhone 12 全系列的屏幕分辨率變化，Apple 為了保持 PPI 也即屏幕清晰度只增不減，不得不在之前已有的邏輯分辨率寬度上同樣利用「等比放大」的方法小幅放大了一點(diǎn)形成了兩個新的邏輯分辨率寬度：390pt、428pt，同時為了讓 iPhone X、iPhone iPhone Xs、iPhone 11 Pro、iPhone 12、iPhone 12 Pro、iPhone 12 mini 這些機(jī)型都具備「放大顯示」功能，暗暗增加了 320pt（全面屏）這個新的邏輯分辨率寬度。整體上可謂十分激進(jìn)的進(jìn)化，雖然顯示效果達(dá)到了最佳，但對于眾多開發(fā)者和第一批嘗鮮的用戶來說，不得不有一段時間的陣痛期。這或許也在某些層面體現(xiàn)了 Apple 的偏執(zhí)吧。

而 iPhone 12 mini 再次使用了渲染分辨率與物理分辨率不同的操作方法，也有些許延續(xù)傳統(tǒng)的感覺。

至此到 2020 年的現(xiàn)在這個時間點(diǎn)，iPhone 的邏輯分辨率寬度進(jìn)化到了 320pt（非全面屏、全面屏）、375pt（非全面屏、全面屏）、414pt（非全面屏、全面屏）、390pt（全面屏）、428pt（全面屏）八小種、五大種。下圖用圖示的方式展示了從 2007 年到 2020 年 iPhone 屏幕尺寸進(jìn)化的歷程，包括尺寸、物理分辨率、渲染分辨率、邏輯分辨率、PPI、放大顯示功能、進(jìn)化邏輯等，具體可點(diǎn)擊查看大圖。

iPhone 屏幕邏輯分辨率激進(jìn)變化的背景下，或許 Apple 已釋放出了足夠的信號：未來的屏幕大小不再是一成不變的，app 的顯示區(qū)域也是可大可小的，針對于不同設(shè)備尺寸適配 app 的方法已經(jīng)過時，循著 Apple 給出的方法和工具，讓 app 自由地在屏幕上呈現(xiàn)，或許才能找到未來的路。

參考文章

• How iOS Apps Adapt to the various iPhone 12 Screen Sizes | by Geoff Hackworth
• Michael Tsai – Blog – iPhone 12 and iPhone 12 Pro
• 臺灣 iOS 開發(fā)者 @ethanhuang13 的推文

本文轉(zhuǎn)載自：向遠(yuǎn)公園 | STEP PARK

本文作者：北極熊不不，微博：[eafl id=”107742″ name=”” text=”@北極熊不不”]

原文鏈接：[eafl id=”107738″ name=”尺寸轉(zhuǎn)載鏈接” text=”https://steppark.net/16030487843973.html”]