前言:
剛更新了iOS 11和Xcode 9,試了下iPhone X模擬器上跑公司的項(xiàng)目搞监,發(fā)現(xiàn)項(xiàng)目在iPhone X這個(gè)大長臉上運(yùn)行還存在很多適配問題仁连。所以寫此文章記錄自己在適配iPhone X時(shí)所遇到的問題,也希望能幫助到需要幫助的同學(xué)們昌罩。如有問題也希望大家提出來哭懈,共同探討,共同進(jìn)步茎用。
關(guān)于iPhone X
北京時(shí)間的9月13日凌晨遣总,美國當(dāng)?shù)貢r(shí)間的9月12日上午,蘋果在發(fā)布會(huì)上發(fā)布了四款產(chǎn)品轨功,包括全新的Apple Watch Series 3旭斥,Apple TV 4K,iPhone 8/8 Plus古涧,和全新iPhone X四款全新產(chǎn)品垂券。其中X是數(shù)字10的意思,因此蘋果將其讀音讀作“iPhone Ten”蒿褂。
應(yīng)為有設(shè)備的圓角圆米,傳感器區(qū)域(劉海),或用于訪問主屏幕的指示器(Home Indicator)原因啄栓,從iOS 11.0引入了UIView的safeArea(安全區(qū))的概念娄帖,同時(shí)廢除了iOS 7 開始在 UIViewController中引入的 topLayoutGuide和 bottomLayoutGuide
名稱 | iPhone X | iPhone 6s |
---|---|---|
屏幕 | 375pt × 812pt | 375 pt × 667 pt |
Tabbar | 83pt | 49pt |
StatusBar | 44pt | 20pt |
Navigation | 44pt | 44pt |
- 尺寸:1125px × 2436px(375pt × 812pt @3x)
- Tabbar:由49pt變?yōu)榱?3pt (加上底部留給Home Indicator的空白部分)。
- StatusBar:由20pt變?yōu)?4pt
- Navigation:還是44pt
iPhone X 蘋果官方人機(jī)交互指南
iPhone X 蘋果官方人機(jī)交互指南 手動(dòng)翻譯(由博客名:我的杯洗具翻譯的)
項(xiàng)目中遇到的適配問題:
一昙楚、動(dòng)態(tài)計(jì)算statusbar + navigationBar高度
開發(fā)中我們需要知道statusbar 和 navigationBar高度用于計(jì)算界面中控件的位置近速,但是由于iPhone X有個(gè)大劉海使得statusbar的高度不同于之前的機(jī)型。這時(shí)候如果項(xiàng)目中的計(jì)算值是寫死話堪旧,就會(huì)出現(xiàn)適配問題削葱。解決辦法是動(dòng)態(tài)計(jì)算來適配不同的機(jī)型
// 狀態(tài)欄(statusbar)
CGRect StatusRect = [[UIApplication sharedApplication] statusBarFrame];
//標(biāo)題欄
CGRect NavRect = self.navigationController.navigationBar.frame;
CGFloat y = StatusRect.size.height + NavRect.size.height;
二、MJRefresh的footer出現(xiàn)在Home Indicator位置上
(此方法只適合navigationController為不透明狀態(tài)下)
這是應(yīng)為iOS11棄用了automaticallyAdjustsScrollViewInsets屬性淳梦,新增contentInsetAdjustmentBehavior來替代它析砸。就是iOS11會(huì)自動(dòng)限制CollectionView的底部不會(huì)超出安全區(qū)范圍,不想系統(tǒng)幫我們自動(dòng)設(shè)置邊距則要在iOS11中加上下面這句
if (@available(iOS 11.0, *)) {
self.myCollectionView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;
} else {
// Fallback on earlier versions
}
但是這時(shí)候就會(huì)出現(xiàn)我們的CollectionView內(nèi)容會(huì)超出安全區(qū)和Home Indicator重疊爆袍,這樣最底下的cell兩邊就會(huì)被屏幕圓角切掉一部分首繁,影響用戶體驗(yàn)作郭。我的解決辦法是給collectionView加上一個(gè)34pt高的footer
UICollectionView:
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
//這里省略其他屬性配置......
//......
if (iPhoneX) {
flowLayout.footerReferenceSize = CGSizeMake(SCREEN_WIDTH, 34);
}
self.myCollectionView = [[UICollectionView alloc] initWithFrame:[UIScreen mainScreen].bounds collectionViewLayout:flowLayout];
UITableView:
if (iPhoneX) {
self.myTableView.tableFooterView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 0, 34)];
//注意:如果UITableViewStyle = UITableViewStyleGrouped 時(shí),這樣設(shè)置會(huì)導(dǎo)致tableHeaderView也有34的高度
}
或者
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
if (self.myTableDataSourceArray.count - 1 == section && iPhoneX) {
return 34;
}
return 0.0001;
}
注:iPhoneX是判斷機(jī)型的宏:#define iPhoneX ([UIScreen mainScreen].bounds.size.height == 812.0)
SCREEN_WIDTH是屏幕寬宏:#define SCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width
三弦疮、Tableview分區(qū)頭高度 和 動(dòng)畫異常問題
參考《你可能需要為你的APP適配iOS11》第三部分-UIScrollView and UITableView的新特性
self.myTableView.estimatedRowHeight = 0;
self.myTableView.estimatedSectionHeaderHeight = 0;
self.myTableView.estimatedSectionFooterHeight = 0;
四夹攒、界面布局超出safeArea(安全區(qū))內(nèi)容被指示器蓋住
Xib等可視界面布局:
由于iPhone X底部有圓角和指示器的原因,之前項(xiàng)目布局在底部的控件會(huì)被指示器遮擋或被圓角切掉一部分胁塞。有時(shí)候界面布局比較緊湊或?yàn)榱嗣烙^咏尝,為了滿足在iPhone X下不被遮擋而在其它機(jī)型上又還是位置不變,這時(shí)候safeArea就起作用了啸罢,可以勾選Xib的Safe Area屬性
勾選了Safe Area屬性你就會(huì)發(fā)現(xiàn)左邊多了個(gè)Safe Area编检,這時(shí)候你需要重新約束一下被遮擋的控件,約束的參照對(duì)象應(yīng)該是Safe Area伺糠,這樣新的約束就會(huì)根據(jù)Safe Area的變化而改變位置蒙谓,不會(huì)出現(xiàn)內(nèi)容被指示器蓋住的問題了。
但是有一點(diǎn)需要注意训桶,就是必須是Builds for iOS9.0 及以上的版本,不然勾選了就會(huì)報(bào)Safe Area Layout Guide before ios9.0
錯(cuò)誤酣倾。如果你要適配低于9.0的版本舵揭,那只能使用代碼布局或另尋其它辦法了。
代碼布局:
iOS11為UIViewController和UIView增加了兩個(gè)新的屬性safeAreaInsets和safeAreaLayoutGuide, 通過這兩個(gè)屬性我們可以獲得安全區(qū)域的范圍躁锡。
//獲取某View安全區(qū)域范圍的宏
#define VIEWSAFEAREAINSETS(view) ({UIEdgeInsets i; if(@available(iOS 11.0, *)) {i = view.safeAreaInsets;} else {i = UIEdgeInsetsZero;} i;})