WKWebView 底部视图显示不全

好早之前遇到的这个问题，用WKWebView 显示界面时，最底部的悬浮窗口少了不少像素。这是之前用UIWebView没有遇到过的。

这个问题只出现在ios10 ， ios11应该是已经修复了。（反正我没有再遇到了）

先写解决方法，再说探求过程。

这个问题是导航栏导致的。也算是苹果的bug。将导航栏设置为不透明，问题直接就解决了。

selfnavigationControllernavigationBartranslucent = NO;

----------------------------------------------------------华丽的分割线----------------------------------------------

下面我们来调试下ios10下的WKWebview加载网页。底部悬浮窗是消失的。于是我打印了下偏移。

发现了么。offset的Y轴偏移量是-64。刚好是底部消失的距离。然后我猜测这个距离刚好和导航栏高度有关 (有些朋友消失20像素，我还没有研究，但是我感觉是跟状态栏有关)。

想起ios的排版方式，如果导航栏带透明。frame排版是从导航栏上开始的。如果不透明则在导航栏下面开始排布。所以猜测和透明度有关。事实证明。猜对了！！！

将导航栏设为不透明之后再打印。

界面也回归正常。

本来以为这个问题遇到的人不多。

在iOS中，可以通过设置webview的高度来调整键盘的高度，以便不占用webview的高度。可以使用以下代码来设置webview的高度：

let webViewHeight = UIScreenmainboundsheight - keyboardHeight

webViewframe = CGRect(x: 0, y: 0, width: UIScreenmainboundswidth, height: webViewHeight)

这样就可以让键盘不占用webview的高度，从而达到最佳的效果。

WKWebView是苹果在iOS 8之后推出的框架，关于它比webview的优势这里就不讲了。主要说一下与JS交互的问题，其实WKWebView已经内置了JS与OC的互调、传值等方法，使用起来也非常方便，下面就来细细的探讨一下以及自己遇到过的坑

首先来看下WKWebView的初始化相关设置：

一、导入相关头文件、设置相关代理和属性

二、WKWebView初始化

注意:

楼主遇到的第一个坑：如果JS给OC传值为空，必须写成: postMessage(null)，如果什么都不写，方法是调不通的。

1、在viewWillAppear中配置， addScriptMessageHandler name: "这里就是JS的方法，方法名必须统一"

楼主遇到的第二个坑：配置完后必须在 viewWillDisappear 中 remove，否则会造成循环引用，导致crash

2、实现 WKScriptMessageHandler 协议

以上就是JS调OC，JS向OC传值

楼主这里举三个例子：

1: webview加载完成前，将用户信息传给js

2: webview加载完成，将相关信息传给js

3: 调用相册或相机时，将选择的请求后台接口，后台返回地址，将该地址回传给H5，H5将显示到页面上

第一个例子: webView加载完成前传值

因为 evaluateJavaScript 方法默认是在加载完成后调用，所以直接在页面开始加载中调用是传不过去的，这个时候怎么办呢？ 我们可以让js端写两个方法， 第一个方法是js端开始向oc端发起信息需求的方法名，当oc端收到该方法名的时候，就去调用js端第二个获取传值的方法，把信息传递过去。

先让JS端写个方法调OC，OC实现方法后在这个方法内部给JS传值

在WKScriptMessageHandler协议中，实现该方法，然后在方法内部给JS传值

注意： 以上就是在Webview加载完成前传值，如果打印没报错，证明传参成功，如果web端没收到，让他把获取到值的方法写到页面中即可。

第二个例子: webView加载完成,传值给js

第三个例子: 传地址给js，js拿到后显示

1：拍照事件

11：将拍的照片请求上传接口，成功返回地址，并传值给H5

2: 从相册中选取照片

22：将相册中选取的照片请求上传接口，成功返回地址，并传值给H5

注意: getPhotoCallback 即为调用的方法名，后面传值格式必须为: ('') ， 这里遇到了第三个坑， 如果方法名写为: 名称名称 (例如：hello getPhotoCallback)，这种是调不通的，可以写成hello_getPhotoCallback的形式，一般的话最好还是定义一个完整的名称。 刚开始这个问题卡了比较久，一直调不通，在此记录一下

在 viewDidLoad 中注册进度条监听

开始加载网页

加载完成

加载失败

页面跳转失败

progressView懒加载

添加监听观察者

最后别忘记 removeObserver

Demo地址: >

以上就是关于WKWebView 底部视图显示不全全部的内容，包括:WKWebView 底部视图显示不全、ios键盘不占webview的高度、iOS WKWebView与H5交互，JS调OC传值、OC调JS传值、进度条加载等(干货满满)等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！