iPhone X 适配(全) (3)

这个问题的原因是:横屏下的 UITableView,Cell 都是和屏幕一样宽,但是 Cell 的 ContentView 会被 inset 到 SafeArea 区域。
解决方法是:可以通过调整 Tableview 的默认行为,改变 contentView 的属性(如上图 inset To SafeArea)来让 contentview 顶到边缘,弊端是会改变整个 cell 的内容显示,而且 contentView 的 layoutMargin 依然还是相对于 SafeArea 的。
最佳方案是:改变 UITableViewHeaderFooterView.backgroundView 的 backgroundColor。

iPhone X 适配(全)

iPhone X 适配(全)

图3.4 iOS 11 修改前后的样式对比

刘海打理初体验

① 我们来看下开头说的那个刷新之后首页顶上去的问题怎么处理。经过排查,这个问题属于“状态栏变高系列”,解决方案就是把固定的20pt高度改成 [[UIApplication sharedApplication] statusBarFrame].size.height]

② 搜索页面输入框的位置发生了偏移,这是因为 iOS 11 的导航栏的视图层级结构发生了变化,和 iPhone X 的并无直接关系。iOS 11 导航栏的视图层级关系如下:

iPhone X 适配(全)

iPhone X 适配(全)

图4.1 iOS 11 之后的 NavigationBar     图4.2 iOS 11 之前的 NavigationBar

适配方式是:取到这个 _UIButtonBarStackView 的位置和尺寸信息,然后更改 PFBNavigationBarContainerView 的 X 坐标。

③ “我的Tab” 页面多出来一块儿灰色的区域,经过排查发现这个是 Tableview 的背景色。也就是说其实是 Tableview 向下偏移了。

iPhone X 适配(全)

图4.3 iOS11 下“我的Tab” 页面 Tableview 发生偏移

出现这个的原因是:iOS 11 之后 scrollview 多出来一个 adjustedContentInset 区域。

iPhone X 适配(全)

图 4.4 iOS 11下 ScrollView 的新属性

通过打印这个值,我们发现正好和 contentoffset.y 相符合。

iPhone X 适配(全)

图 4.5 这个新属性在 iPhone X 上的值

那为什么会发生偏移?这个偏移的值又是怎么确定的?其实是当 Tableview 的 frame 超出了 safeArea 范围之后,系统会调整内容的位置。系统通过设置 adjustedContentInset 为 safeAreaInset 的值让 Tableview 偏移

iPhone X 适配(全)

图 4.6 iPhone X 上 safeAreaInset 的值

注意一下这个 adjustedContentInset 是 readOnly 的属性。我们可以通过设置 Tableview.contentInsetAdjustmentBehavior=UIScrollViewContentInsetAdjustmentNever 来纠正这个位置。当然还可以通过设置 tableview.contentOffset 来抵消这个值,但还是推荐第一种。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zwdxws.html