WKWebView h5 页面显示不全问题
首先先来看一下效果图如下所示:
1.png
2.png
图 1 下面的分享按钮只显示出一点, 当时想出现这样的 bug 无外乎两点 1.h5 那边设备兼容问题 2.ios 这边显示问题, 问了 h5, 说是直接加载底部的 CSS 样式, 安卓那边显示 OK, 最后看了 h5 的代码也没发现问题, 最后决定尝试自己试着解决一下, 最后发现原因就是没有正确设置 UIScrollView 的高度没有设置正确导致 wkwebView 内容显示不完整, 加上下面这句一般就可以解决问题:
self.edgesForExtendedLayout = UIRectEdgeNone;
究其原因详细如下:
在 IOS7 以后 ViewController 开始使用全屏布局的, 而且是默认设置属性 edgesForExtendedLayout(它是一个类型为
UIExtendedEdge 的属性, 指定边缘要延伸的方向) 是 UIRectEdgeAll, 四周边缘均延伸, 就是说,
如果即使视图中上有 navigationBar, 下有 tabBar, 那么视图仍会延伸覆盖到四周的区域.
因为一般为了不让 tableView 不延伸到 navigationBar 下面, 属性设置为 UIRectEdgeNone 即可
同时如果导航栏有其他杂色只需要设置导航栏的透明度即可 self.navigationController.navigationBar.translucent = NO;
来源: http://www.jianshu.com/p/e376f352e282