34. 適配iOS11捐寥,適配iPhoneX,適配安全區(qū)的幾個(gè)文章和宏

  • 重磅!!! 在繼今年年初WWDC之后祖驱,蘋果官方文檔的中文適配逐步加快握恳!現(xiàn)在已經(jīng)出了官方版適配iPhoneX的中文文檔!《為 iPhone X 更新您的 app》捺僻。蘋果是越來越重視中國(guó)的開發(fā)者了乡洼!
  • 2017.09.29更新:修正關(guān)于安全區(qū)域的描述!更加完善匕坯!推薦大家看WWDC的視頻
  • 2018.02.04更新:公司真正適配iPhoneX之后的一些糾正束昵,推薦兩篇文章。

2018.02.04更新部分:公司真正適配iPhoneX之后的一些糾正葛峻,找到了這篇文章锹雏,既然有現(xiàn)成的我就不寫了。


2017.09.29更新部分:

首先關(guān)于適配iPhoneX礁遵,適配安全區(qū)講,因?yàn)閕PhoneX的劉海和底部Home Indicator上滑指示條的存在腰耙,所以弄出來一個(gè)安全區(qū)的概念榛丢。這個(gè)區(qū)域,就是保證我們的內(nèi)容的在任何時(shí)候挺庞,尤其是橫屏狀態(tài)下晰赞,內(nèi)容不被遮蓋!而且這個(gè)安全區(qū)是可以自己設(shè)置更改的选侨,不過修改了安全區(qū)到底是否影響審核掖鱼,還是需要看蘋果時(shí)候的審核規(guī)則,目前來看援制,還是老老實(shí)實(shí)的把內(nèi)容寫到安全區(qū)域內(nèi)為上策~

這里特別注意戏挡!如果你的應(yīng)用支持橫屏, 那么在橫屏狀態(tài)下的安全區(qū)域一定要留意!晨仑,當(dāng)然褐墅,豎屏狀態(tài)下,底部34pt的安全區(qū)域也要注意洪己! 另外妥凳,安全區(qū)域內(nèi)不要加交互邏輯! 這部分不允許應(yīng)用和用戶交互! 也就是說 王者農(nóng)藥擋住了金幣 不可能發(fā)生,因?yàn)檫^審都是個(gè)問題答捕!這個(gè)在《Human Interface Guidelines - iPhone X》說的很清楚, 如下圖:

橫,豎屏幕下的安全區(qū)域
iPhone X 的 Home Indicator 區(qū)域(轉(zhuǎn))

另外: 從《如何評(píng)價(jià)新版 iPhone X 的設(shè)計(jì)規(guī)范逝钥?》中,總結(jié)得到:當(dāng)豎屏的時(shí)候拱镐,安全區(qū)的頂端始于屏幕頂端44pt(132px)處艘款,而下端距離屏幕底端34pt(102px)長(zhǎng)持际;當(dāng)你的應(yīng)用在橫屏的時(shí)候,與豎屏一樣哗咆,有劉海的一側(cè)留出44pt蜘欲,無劉海的一側(cè)34pt。

Ps: 猜想一下:我覺得底部的安全距離岳枷,在豎屏狀態(tài)下且沒有tabbar的頁(yè)面芒填,去掉還是蠻爽的一件事情,不過空繁,我們看到上圖中,底部的安全區(qū)域是留給 Home Indicator 的朱庆,高度為34pt盛泡,作用是替代雙擊Hone鍵! 把內(nèi)容填充到底部會(huì)和《Human Interface Guidelines - iPhone X》的指導(dǎo)意見相違背娱颊,但是底部留出那么大一塊區(qū)域傲诵,全面屏看起來也是怪怪的。
還有箱硕,最近我們提交的上架審核拴竹,貌似蘋果還沒有針對(duì)應(yīng)用對(duì)iPhoneX的適配情況進(jìn)行審查,所以目前剧罩,豎屏狀態(tài)下栓拜,去掉底部的安全距離視覺上很爽,但是不知道審核會(huì)不會(huì)遇到問題』菸簦現(xiàn)在有兩種聲音幕与,一種是在底部安全區(qū)域不能加內(nèi)容,另一種是在安全區(qū)域的內(nèi)容不能交互镇防,影響 Home Indicator 的使用啦鸣。目前建議大家還是中規(guī)中距,畢竟iPhone X上市和普及是個(gè)漫長(zhǎng)的過程来氧,適配也是一個(gè)有很長(zhǎng)時(shí)間的緩沖期诫给,我們可以后續(xù)再看。 如果你等不及的話啦扬,可以參考一下iPhone X模擬器中系統(tǒng)應(yīng)用的處理方式中狂。

再說一下,依照我的理解考传,這個(gè)安全區(qū)域吃型,白話來講,其實(shí)就是系統(tǒng)給你的一個(gè)指導(dǎo)的顯示區(qū)域的僚楞!參考這個(gè)值適配會(huì)非常簡(jiǎn)單勤晚。當(dāng)然枉层,你也可以無視這個(gè)方法,手動(dòng)自己適配赐写,這個(gè)當(dāng)然是絕對(duì)不推薦的了鸟蜡。

我覺得安全區(qū)域目前最終的兩個(gè)屬性和一個(gè)方法是:

  • safeAreaInsets和safeAreaLayoutGuide
  • -(void)viewSafeAreaInsetsDidChange

關(guān)于這兩個(gè)屬性和一個(gè)方法,網(wǎng)上已經(jīng)有很多說明挺邀,下邊是我適配過程中的幾個(gè)宏揉忘,還在適配,還在完善:

// UIScreen width.
#define  LL_ScreenWidth   [UIScreen mainScreen].bounds.size.width

// UIScreen height.
#define  LL_ScreenHeight  [UIScreen mainScreen].bounds.size.height
// iPhone X 
#define  LL_iPhoneX (LL_ScreenWidth == 375.f && LL_ScreenHeight == 812.f ? YES : NO)

// Status bar height.
#define  LL_StatusBarHeight      (LL_iPhoneX ? 44.f : 20.f)

// Navigation bar height.
#define  LL_NavigationBarHeight  44.f

// Tabbar height.
#define  LL_TabbarHeight         (LL_iPhoneX ? (49.f+34.f) : 49.f)

// Tabbar safe bottom margin.
#define  LL_TabbarSafeBottomMargin         (LL_iPhoneX ? 34.f : 0.f)

// Status bar & navigation bar height.
#define  LL_StatusBarAndNavigationBarHeight  (LL_iPhoneX ? 88.f : 64.f)

#define LL_ViewSafeAreInsets(view) ({UIEdgeInsets insets; if(@available(iOS 11.0, *)) {insets = view.safeAreaInsets;} else {insets = UIEdgeInsetsZero;} insets;})

因?yàn)榫W(wǎng)上出的了很多資料端铛,所以我只負(fù)責(zé)收集一下泣矛,覺得有價(jià)值的幾篇文章,看完相信大家覺得適配iPhone X其實(shí)很簡(jiǎn)單(如果前期基類寫的好的話禾蚕,只需要在基類和在個(gè)別需要特別顯示效果的頁(yè)面修改就可以了您朽! 凸顯基類此時(shí)的重要性,你的項(xiàng)目有基類吧换淆?):

最近看到了美團(tuán)點(diǎn)評(píng)技術(shù)團(tuán)隊(duì)的適配文章哗总,昨天才發(fā)出來的,細(xì)節(jié)很足倍试! 首推大家看下:
《關(guān)于劉海打理這種事兒讯屈,美團(tuán)點(diǎn)評(píng)的iOS工程師早就有經(jīng)驗(yàn)》 第3, 第4篇也是大廠的適配方案, 但是出的比較早。剩下的文章就按照序號(hào)依次看就可以了县习。

  1. 《關(guān)于iPhone X 的適配》
    原作者博客地址:
    https://www.lee1994.com/guan-yu-iphone/

  2. 《iOS11 & iPhone X 適配指南》

  3. 《企鵝 FM-iOS 11 安全區(qū)域適配總結(jié)》

  4. 《簡(jiǎn)書App適配iOS 11》

  5. 《iOS11適配iPhoneX總結(jié)》

  6. 《適配iOS11&iPhoneX的一些坑》

  7. 《Human Interface Guidelines - iPhone X》

  8. 《Human Interface Guidelines - What's New in iOS 11》

  9. 《iOS11涮母、iPhone X、Xcode9 適配指南》


小細(xì)節(jié):

  1. 《iOS11保存相冊(cè)崩潰》

另外准颓,iOS程序犭袁, 簡(jiǎn)書寫了一系列的針對(duì)iOS11新特性的文章哈蝇,大家可以跟隨關(guān)注下:

這次升級(jí)并沒有改太多的東西,主要問題是在安全區(qū)上攘已。
iOS11開發(fā)之有趣的新特性炮赦,第一波。
整體 iOS 11 的適配工作量并不是很多样勃,我就不講了吠勘,講一些有趣的東西,期初想起名叫“實(shí)用的”峡眶,雖然今天講的大部分都是實(shí)用的剧防,不過有一些還是“有趣但不太實(shí)用”,或者說會(huì)在相當(dāng)長(zhǎng)一段時(shí)間內(nèi)不太實(shí)用辫樱。

交流


希望能和大家交流技術(shù)
Blog:http://www.lilongcnc.cc


最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末峭拘,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌鸡挠,老刑警劉巖辉饱,帶你破解...
    沈念sama閱讀 216,372評(píng)論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異拣展,居然都是意外死亡彭沼,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,368評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門备埃,熙熙樓的掌柜王于貴愁眉苦臉地迎上來姓惑,“玉大人,你說我怎么就攤上這事按脚∮诒校” “怎么了?”我有些...
    開封第一講書人閱讀 162,415評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵辅搬,是天一觀的道長(zhǎng)望众。 經(jīng)常有香客問我,道長(zhǎng)伞辛,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,157評(píng)論 1 292
  • 正文 為了忘掉前任夯缺,我火速辦了婚禮蚤氏,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘踊兜。我一直安慰自己竿滨,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,171評(píng)論 6 388
  • 文/花漫 我一把揭開白布捏境。 她就那樣靜靜地躺著于游,像睡著了一般。 火紅的嫁衣襯著肌膚如雪垫言。 梳的紋絲不亂的頭發(fā)上贰剥,一...
    開封第一講書人閱讀 51,125評(píng)論 1 297
  • 那天,我揣著相機(jī)與錄音筷频,去河邊找鬼蚌成。 笑死,一個(gè)胖子當(dāng)著我的面吹牛凛捏,可吹牛的內(nèi)容都是我干的担忧。 我是一名探鬼主播,決...
    沈念sama閱讀 40,028評(píng)論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼坯癣,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼瓶盛!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,887評(píng)論 0 274
  • 序言:老撾萬榮一對(duì)情侶失蹤惩猫,失蹤者是張志新(化名)和其女友劉穎芝硬,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體帆锋,經(jīng)...
    沈念sama閱讀 45,310評(píng)論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡吵取,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,533評(píng)論 2 332
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了锯厢。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片皮官。...
    茶點(diǎn)故事閱讀 39,690評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖实辑,靈堂內(nèi)的尸體忽然破棺而出捺氢,到底是詐尸還是另有隱情,我是刑警寧澤剪撬,帶...
    沈念sama閱讀 35,411評(píng)論 5 343
  • 正文 年R本政府宣布摄乒,位于F島的核電站,受9級(jí)特大地震影響残黑,放射性物質(zhì)發(fā)生泄漏馍佑。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,004評(píng)論 3 325
  • 文/蒙蒙 一梨水、第九天 我趴在偏房一處隱蔽的房頂上張望拭荤。 院中可真熱鬧,春花似錦疫诽、人聲如沸舅世。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽雏亚。三九已至,卻和暖如春摩钙,著一層夾襖步出監(jiān)牢的瞬間罢低,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,812評(píng)論 1 268
  • 我被黑心中介騙來泰國(guó)打工腺律, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留奕短,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,693評(píng)論 2 368
  • 正文 我出身青樓匀钧,卻偏偏與公主長(zhǎng)得像翎碑,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子之斯,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,577評(píng)論 2 353

推薦閱讀更多精彩內(nèi)容