前幾天看到了顏偉CSD的一篇關(guān)于 iPhone X 的適配文章 “說人話泳赋！三分鐘弄懂iPhone X 設(shè)計(jì)尺寸和適配”瘾带，自己做了一點(diǎn)摘錄和思考補(bǔ)充如下：
1. 改變的性質(zhì)
目前我在進(jìn)行 App 設(shè)計(jì)都是以 iPhone 6 為設(shè)計(jì)基礎(chǔ)，再去進(jìn)行不同尺寸適配（對Plus / SE）油吭，及Android 平臺差異的適配斩祭。
單純從設(shè)計(jì)的邏輯分辨率的角度看裁替，相對iPhone6，寬度不變荞估，高度增加咳促。
2. 邏輯高度增加多少呢？
物理分辨率的變化勘伺，導(dǎo)致@x1的邏輯分辨率增加了145跪腹，
δ = +145pt考慮 Safe Area的限制，去掉頭部狀態(tài)欄（44pt）飞醉，底部 Home Bar（30pt）冲茸，高度的邏輯分辨率變化
δ = +145 -44 -30 = +71pt原來的 Status Bar 顯示在了現(xiàn)在頭部的劉海區(qū)域，原來占用的20pt可以用來設(shè)計(jì)內(nèi)容和行為缅帘，高度變化
δ = +71 +20 = +91pt
總體而言轴术，
- 可以用來設(shè)計(jì)行為的 Safe Area 增加了 91pt。
- 可以用來顯示內(nèi)容的區(qū)域钦无，可以嘗試?yán)?Home Bar 位置的30pt逗栽。
3. 對設(shè)計(jì)的影響
- 瀑布流布局，基本沒有影響失暂。
- 豎直方向更多空間彼宠，不做任何調(diào)整也能保證重要內(nèi)容一屏顯示完鳄虱。為了顯示效果更好，建議做適當(dāng)調(diào)整凭峡，比如豎直方向的間隔拉升醇蝴。
- 需要整屏顯示的頁面，如啟動(dòng)頁想罕，播放頁面悠栓，需要微調(diào)。
- 需要沉浸式的應(yīng)用按价，如視頻惭适、閱讀等大多數(shù)內(nèi)容消費(fèi)應(yīng)用，Danger Area 可以用來顯示內(nèi)容楼镐，增加內(nèi)容顯示的空間癞志，提高使用感受。
- H5頁面框产，大部分都是圖片凄杯，在同樣屏幕比例時(shí)，只需要等比縮放秉宿。在比例變化時(shí)戒突，適當(dāng)調(diào)整間隔即可。當(dāng)然描睦，如果是整張圖膊存，就需要調(diào)整活動(dòng)圖片了。
- 因?yàn)槠聊槐壤兓腊龋邮蓍L隔崎，等比例放大會(huì)導(dǎo)致左右兩側(cè)內(nèi)容被裁切，需要注意韵丑。
BTW爵卒，我只是從交互設(shè)計(jì)的角度進(jìn)行一些學(xué)習(xí)思考，難免存在偏誤撵彻，歡迎指證钓株。
Thanks
Wedy
