iOS開發:為你的應用兼容iPhone X

izhangsan 7年前發布 | 30K 次閱讀 iOS開發 移動開發

每年蘋果爸爸都會在六月份的WWDC上發布有關下一代iOS的新特性和改動內容,開發者們有半年時間去準備和兼容最新版本的iPhone和操作系統。

但是這一次為了在發布會前不泄露iPhone X的相關信息(實際上我們早就知道了=。=),蘋果直到前幾天才在官網上線了兼容全面屏的指導文檔和視頻。離iPhone X正式上市還有兩個月不到的時間,我們需要為我們的app做哪些準備呢?

屏幕

我們在編碼中使用的是以 point 為單位的屏幕尺寸(在不同設備上每個point對應的實際像素點是不一樣的),iPhone 8的尺寸是 375pt × 667pt @2x ,iPhone X的尺寸是 375pt × 812pt @3x ,也就是屏幕寬度是一樣的,但是高出了145pt,大概能多顯示20%的內容。

屏幕

注意iPhone X的屏幕素質比較好,所以它需要加載較高像素的圖片,我們要提供必要的@3x資源。

另外由于iPhone X極高的長寬比,我們用作背景的圖片都需要重新設計,以保證比例適合,內容被裁切后效果仍然ok。

屏幕

status bar

iPhone X的狀態欄高度是高于之前所有的iPhone版本的,所以在代碼里寫死 kStatusBarHeight == 20 的地方 都會出錯

劉海變高

也就是說,之前使用固定狀態欄高度來進行布局的代碼都需要調整為動態布局方式,否則會出現內容被遮擋的問題。特別是圖中這個64,一直在iOS開發中常數般的存在,最后也被蘋果爸爸擺了一道。

此處不能寫死

關于狀態欄另外兩個需要注意的地方:

  • 不要在iPhone X下隱藏狀態欄,一個原因是顯示內容足夠高了,另一個是這樣內容會被劉海切割。

  • 現在通話或者其它狀態下,狀態欄高度不會變化了,程序不需要去做兼容。

高度不變

布局

iPhone X的布局有很多改變,這是因為:

  • 劉海的存在使橫屏的情況變得復雜

  • 四個角變圓,需要防止內容被切割

  • 代替home鍵的長條(不知道官方名字叫什么, homeBar ?)使得屏幕底部的布局需要調整

很多系統經典的控件,比如TableView,Collection,Navigation,TabBar等都會自動適應iPhone X(呵呵,一定會有很多坑等著打補丁或者讓開發者擦屁股)。

Safe Area

iOS11引入了 safeArea 的概念,用來替代之前的 topLayoutGuide 和 bottomLayoutGuide ,safeArea用來描述視圖不被任何內容遮擋的部分。它提供兩種方式: safeAreaInsets 或 safeAreaLayoutGuide 來提供給你safeArea的參照值。

safeArea

在iPhone X上,視圖的默認safeArea如下圖所示:

safeArea2

可以看到,底部的Bar還有四周圓角,都對這個safeArea進行了切割。蘋果官方的設計指導是使用 以safeArea為框以layoutMargin為間距 來進行UI布局。

橫屏

在橫屏狀態下,不能因為劉海的原因將內容向左或者向右便宜,要保證內容的中心對稱:

center

center2

另外,之前所有版本的iPhone tableView的cell和它的contentView的大小是相同的,開發者相對cell布局和相對contentView布局效果上不會有太大區別。

但是在iPhone X下,由于劉海和圓角的存在,tableView的contentView會被裁切,所以所有的布局都應該被調整為相對contentView布局,否則會越界:

tableView

一致性

蘋果對iOS中運行的app的一致性有很高的要求,在iPhone X下,開發者不能自己去遮蓋圓角、狀態欄,特別是底部的homeBar,即使你認為劉海很丑,也許用戶看著看著就習慣了呢……

關于homeBar,它的顏色是會自動適應的,保持著『時刻能找到但是又不那么顯眼』的狀態,所以開發者不用去為它費心添加背景啊,強調啊啥的,蘋果爸爸會十分感動然后拒絕掉你的……

交互

在交互方面,iPhone X最大的改變就是底部那個無時無刻不存在的 homeBar 了,代替了原來home按鍵的功能,系統級的任務切換和回到桌面 、、,都是上滑這個細細的長條。

homeBar

所以蘋果爸爸的意思是:

趕緊把你自己寫的上滑手勢 乖乖刪掉~

當然如果app確實需要這個手勢,可以打開程序開關覆蓋系統的手勢,但是這樣用戶就需要滑動兩次來回到桌面了,這會讓他們非常懷念home鍵。

兼容

首先是iPhone X下的鍵盤和其他系統有區別,會多出來那個很有趣的animateEmoji工具欄,所以在做鍵盤相關處理的時候要關注兼容性問題,至少:高度不要寫死了……

iPhone X的認證使用的是全新的faceId,所以如果app需要使用認證相關api,需要根據設備區分touchId和faceId,可以看 文檔

認證

 

來自:http://www.cocoachina.com/ios/20170920/20608.html

 

 本文由用戶 izhangsan 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!