前言
与以往的iphone不同，这次iphone x用上了时下流行的全面屏设计，屏幕的分辨率和比例都是苹果首次采用，而且还有个“别致的刘海”，这就需要现有的app为iphone x重新作适配了。
所以iphone x 的到来，惊艳的是果粉，苦逼的是程序猿。今天升级到xcode9.0，运行项目，所谓的全屏 iphone x，but 页面好像也没有全屏，于是根据之前的适配经验，总算初步解决了这个问题，记录如下，以备后需。
app 页面适配适配前
适配前
问题：app 未全屏显示
解决办法
launchimage 中添加一个和 iphone x 相关的启动图片
* 图片尺寸：1125 * 2436
* contents.json 中代码如下
|
1
2
3
4
5
6
7
8
9
|
{ "extent" : "full-screen", "idiom" : "iphone", "subtype" : "2436h", "filename" : "1125_2436.png", "minimum-system-version" : "11.0", "orientation" : "portrait", "scale" : "3x"} |
适配后
页面布局细节
safe area
动机
iphone x 取消了 home键，实现了高屏占比，所以默认 view 的区域是全屏幕
屏幕四周有圆角、顶部有“刘海”、底部有手势区域
顶部导航栏
* 注意：导航栏高度是 44 + 44
底部手势区域
safe area 如下图 (红色区域)
safe area 大小竖屏
|
1
2
3
4
5
|
▿ uiedgeinsets - top : 44.0 - left : 0.0 - bottom : 34.0 - right : 0.0 |
横屏
|
1
2
3
4
|
- top : 0.0- left : 44.0- bottom : 21.0- right : 44.0 |
自动布局时的注意点
- ios11 以前，我们布局时，视图的 top 和 bottom 一般参照的是 top layout guide 和 bottom layout guide
- ios11 以后，那两个参照已经 deprecated (过时)了，而被 safe area 取代。
- safe area 要求最低支持 ios9.0
但凡和父视图相关的 top 或者 bottom 属性的自动布局，应该参照 safe area。（之前默认是 superview，当然如果产品允许，那就是另一回事了）
选择 safe area布局示例如下：
未选择 safe area布局示例如下：
网上有看到有黑iphone x的，说用它没法玩王者荣耀等游戏，理由是可能看不到自己有多少钱或者推塔键和信号键没了，对此估计是多虑了！iphone x 出售之前，游戏厂商肯定会做适配，高屏占比只会提高游戏体验，不会产生那么严重的视觉问题的。
适配前后，效果图示例如下：
xcode9 适配
wkwebviewjavascriptbridge
|
1
2
3
4
5
6
7
8
9
10
11
|
// 原贴地址：https://github.com/marcuswestin/webviewjavascriptbridge/issues/278- (void)webview:(wkwebview *)webviewdidfailnavigation:(wknavigation *)navigation witherror:(nserror *)error { // …… // xcode 升级到9后 wkwebviewjavascriptbridge.m 中有个 bug // 需要在"decisionhandler(wknavigationactionpolicycancel);"后加上 return，否则崩溃。 // 不升级 xcode 的话，没问题。 decisionhandler(wknavigationactionpolicycancel); return;} |
部分页面适配 iphone x
底部有按钮的页面
适配前
其底部约束如下图：
适配后
其底部约束如下图：
控制器生命周期之viewsafeareainsetsdidchange
- viewdidload
- viewwillappear
- viewsafeareainsetsdidchange（new）
- viewwilllayoutsubviews
- viewdidappear
可以在 viewsafeareainsetsdidchange 后，设置 safe area
|
1
2
3
|
if #available(ios 11.0, *) { self.additionalsafeareainsets = uiedgeinsetsmake(10, 0, 0, 34)} |
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对服务器之家的支持。
原文链接：http://blog.csdn.net/chenyblog/article/details/77987751
