中文字幕av免费专区,精品一卡2卡三卡4卡免费视频,久久精品免费观看

導(dǎo)讀和往常一樣，蘋果發(fā)布新產(chǎn)品，我們作為開發(fā)者都需要對(duì)系統(tǒng)和UI布局進(jìn)行適配，今年也是一樣。從去年發(fā)布的 iphoneX開始，iPhone 手機(jī)加入了劉海設(shè)計(jì)，而且針對(duì)于iphone的劉海，需要特殊的適...

和往常一樣，蘋果發(fā)布新產(chǎn)品，我們作為開發(fā)者都需要對(duì)系統(tǒng)和UI布局進(jìn)行適配，今年也是一樣。從去年發(fā)布的 iphoneX開始，iPhone 手機(jī)加入了劉海設(shè)計(jì)，而且針對(duì)于iphone的劉海，需要特殊的適配。今年新出的3款iphone都帶有劉海，自然也不例外。

在iphonex以前iphone的頂部導(dǎo)航欄高度都是統(tǒng)一的64，底部導(dǎo)航欄是統(tǒng)一的49；從iphonex的劉海屏開始，出了一個(gè)SafeArea的概念，帶劉海設(shè)計(jì)的iphone，頂部導(dǎo)航的高度由原來(lái)的64，變成了88，因?yàn)闋顟B(tài)欄的高度由原來(lái)的20變成了44；底部導(dǎo)航欄的高度由原來(lái)的49，變成了83。

所以對(duì)于iphonex序列的手機(jī)的適配，都需要針對(duì)頂部導(dǎo)航&底部導(dǎo)航進(jìn)行適配。只不過(guò)原來(lái)判斷iphonex的方法，已經(jīng)不能完全判斷新的iphonex新機(jī)型。要么繼續(xù)加if{}else{}進(jìn)行判斷，要么就是尋找新的方法，還好iphonex序列的機(jī)型的寬高比是有規(guī)律的。

從網(wǎng)上看到了別人的帖子列出了iphonex序列機(jī)型的寬高&比例：

//iphoneX 序列機(jī)型的屏幕高寬
//XSM SCREEN_HEIGHTL = 896.000000,SCREEN_WIDTHL = 414.000000 2.1642512077
//XS SCREEN_HEIGHTL = 812.000000,SCREEN_WIDTHL = 375.000000 2.1653333333
//XR SCREEN_HEIGHTL = 896.000000,SCREEN_WIDTHL = 414.000000 2.1642512077
//X SCREEN_HEIGHTL = 812.000000,SCREEN_WIDTHL = 375.000000 2.1653333333

iphonex序列iOS原生的適配

#define SCREEN_HEIGHTL [UIScreen mainScreen].bounds.size.height
#define SCREEN_WIDTHL [UIScreen mainScreen].bounds.size.width
#define KIsiPhoneX ((int)((SCREEN_HEIGHTL/SCREEN_WIDTHL)*100) == 216)?YES:NO
//判斷是否為 iPhoneXS Max，iPhoneXS，iPhoneXR，iPhoneX

react-native針對(duì)于iphonex序列機(jī)型的適配

const {width, height} = Dimensions.get('window');
//iphoneX 序列機(jī)型的屏幕高寬
//XSM SCREEN_HEIGHTL = 896.000000,SCREEN_WIDTHL = 414.000000 2.1642512077
//XS SCREEN_HEIGHTL = 812.000000,SCREEN_WIDTHL = 375.000000 2.1653333333
//XR SCREEN_HEIGHTL = 896.000000,SCREEN_WIDTHL = 414.000000 2.1642512077
//X  SCREEN_HEIGHTL = 812.000000,SCREEN_WIDTHL = 375.000000 2.1653333333

//目前iPhone X序列手機(jī)的適配算法：高寬比先轉(zhuǎn)換為字符串，截取前三位，轉(zhuǎn)換為number類型 再乘以100
export const isIphoneX = (Platform.OS === 'ios' && (Number(((height/width)+"").substr(0,4)) * 100) === 216);

總結(jié)

無(wú)論是iOS原生還是react-native，只要判斷出是iphonex序列機(jī)型，針對(duì)頂部導(dǎo)航欄和底部導(dǎo)航欄做特殊的處理即可。保證頂部導(dǎo)航和底部導(dǎo)航的UI正確顯示，能夠正確響應(yīng)事件。（如果適配不好，會(huì)出現(xiàn)UI顯示不正確和事件不能夠響應(yīng)的情況。）

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持本站。

您可能感興趣的文章:

微信小程序適配iphoneX的實(shí)現(xiàn)方法
Xcode 9下適配iPhoneX導(dǎo)致iOS 10不兼容問(wèn)題的解決方法
iOS 11 safeArea詳解及iphoneX 適配
iPhoneX 各種適配記錄筆記（超全面）
iPhoneX無(wú)導(dǎo)航欄頁(yè)面適配問(wèn)題解決方案
關(guān)于適配iOS11和iPhoneX的一些事
iOS11&iPhoneX適配&Xcode9打包注意事項(xiàng)
iOS11和iPhoneX適配的一些坑

溫馨提示：喜歡本站的話，請(qǐng)收藏一下本站！

當(dāng)前位置:雨林木風(fēng)下載站 > 蘋果教程教程 > 詳細(xì)頁(yè)面

iPhoneX 序列適配方案(小結(jié))_IOS

本類教程下載

系統(tǒng)下載排行