iPhoneX的适配问题

2017-12-28

记录一次iPhone X的适配过程,做个总结

自iOS11后,苹果推出iPhone X。由于iPhoneX的尺寸,外观不太常规,所以适配自然就不太一样。而且iOS11后,有些API做了些改变。

在Xcode中,我打印了iPhone X的一些尺寸信息

StatusBarHeight:44.000000
TabBarHeight:83.000000
NavHeight:44.000000
ScreenHeight:812.000000
frame: [0, 0, 375, 812]

再次打印Phone7的尺寸信息

StatusBarHeight:20.000000
TabBarHeight:49.000000
NavHeight:44.000000
frame: [0, 0, 375, 667]
ScreenHeight:667.000000

首先要在launchImage中加入iPhone X的启动页,大小为1125*2436,再次启动APP发现可以全屏显示了。 launchImage launchImage

在开发中尽量把我们的内容放到图中的safeArea中

在iOS11中增加了几个新的API。

viewSafeAreaInsetsDidChange
UIView增加了safeAreaInsets属性
ViewController增加了additionalSafeAreaInsets属性

经过几次实验发现,viewSafeAreaInsetsDidChange在TabBar的VC不会调用此方法,在非TabBar的Controller会调用此方法,方法的调用顺序如下

viewDidLoad
viewWillAppear
viewSafeAreaInsetsDidChange
viewWillLayoutSubviews

只有在调用了viewSafeAreaInsetsDidChange后才能获取到UIEdgeInsets

在iOS11后我们要更改部分宏的定义

/** 底部安全区高度 */
#define KSafeAreaBottom_Height  (KSCREEN_HEIGHT == 812.0 ? 34 : 0)
/** tabBar高度 */
#define KTABBAR_HEIGHT      [[UIApplication sharedApplication] statusBarFrame].size.height > 20 ? 83 : 49
/** 是否为iphoneX */
#define IS_IPHONE_X         ( fabs( ( double )[ [ UIScreen mainScreen ] bounds ].size.height - ( double )812 ) < DBL_EPSILON )

总结来看,总体变化有:

  • 1.状态栏由20pt变成44pt,所以导航栏从64pt变为88pt
  • 2.底部多出了34pt的home indicator的边距

更多的适配细节还是见苹果人机交互指南网站