iPhone X發布，徹底全新的設計，也徹底定義了新的體驗，與以往的iPhone都有不同，玻璃外殼、搭載著蘋果A11處理器，電池續航能力比iPhone 7長了兩個小時，并且在iPhone X的設計上首次使用了全面屏、面部識別、無線充電等技術，搭載1200萬像素雙攝鏡頭。

然鵝，這些我覺得沒有那頂部的劉海惹人注目，那么UI界面設計和交互細節也會有很多改變，不敢評價，總結一下官方文檔的內容好了，就當作筆記了……

設計適配：

iPhone X 屏幕寬375pt，1125px@3x，高812pt，比iPhone 8 高度多出20%。（真正的@3x?。?/p>

為iPhone X設計需要確保布局填充屏幕，不被圓角、傳感器和home指示器（下面有說明）所掩蓋。

iPhone X 屏幕底部任意位置上滑可以返回主屏或者進入任務切換界面，屏幕底部有一個home指示器固定顯示在app上層。

大多數app使用系統提供的UI元素，會自動適應iPhone X 的屏幕。Navigation bar、tab bar和tool bar會擴展到屏幕頂部和底部弧形區域。

水平布局時，table view全屏顯示，內容只在中間安全區顯示，iOS 11新增了一種布局叫做「Safe Area layout guide」。（下圖藍色+紅色區域是安全區域，紅色是margin，注意水平布局時不顯示狀態欄，安全區底部仍然要留出home指示器的位置）

如果app使用自定義控件或非標準布局，要在iPhone X上運行良好需要一點修改。

一、全屏顯示

iPhone X和4.7寸iPhone屏幕長寬比不同，提供 Fill 和 Fit 2種圖片縮放方式。

二、重新設置關鍵交互和關鍵信息的位置。

交互元素不要靠近角落

屏幕邊緣的視覺元素要移動位置，部分情況下要重新設計。

iPhone X 狀態欄高度更高，在電話和定位等后臺任務時，高度不會變化（就是打電話和導航時，原先頂部增加的彩色帶，現在變成時間信息底部的彩色氣泡，見下圖）

水平布局時，交互元素兩側距離相等，左側右側旋轉時位置固定，方便用戶記憶。

應用可以打開edge protection（邊緣保護？），第1次操作拉出home指示器，第2次退出應用。