WKWebView 底部页面被遮挡 显示不全

在使用WKWebView展示H5页面.

理想效果图:


WKWebView 底部页面被遮挡 显示不全_第1张图片
图1


实际页面展示效果图:

WKWebView 底部页面被遮挡 显示不全_第2张图片
图2

如图,项目来源Item被提交按钮遮挡住,但是上拉的时候能够显示,一放手就回到图1效果.

我的猜想:

   这个"提交"按钮是一直悬浮在页面的底部的.这样的话,也就是说,webView在获取页面的高度的时候并没有获取到"提交"按钮的高度.导致了webView.scrollView.contentSize.height 比实际页面的高度要小,所以会被遮挡住。

那么,既然是获取的页面高度不够,那直接修改webView.scrollView.contentSize 的高度应该就可以了。

[scrollView setContentSize:CGSizeMake(CONTENTSIZEX, scrollView.contentSize.height + 20)];

然而,这样做并没用~~~~~~~~~

一放手 webView.scrollView.contentSize.height 就变为原来的高度了.............表示很忧伤

或许增加网页的高度呢? 加载完成后,通过JS在页面的底部添加一个空白块,高度为"提交"按钮的高度. 经过实验,这样做可以解决这个问题.

加添空白块代码如下:

CGFloataddViewHeight = 20;

NSString * js = [NSString stringWithFormat:@"\

var spaceDiv = document.getElementById(\"AppSpaceDIV\");\

if (spaceDiv){\

spaceDiv.style.height = %@+\"px\";\

} else {\

var spaceDiv = document.createElement(\"div\");\

spaceDiv.setAttribute(\"id\",\"AppSpaceDIV\");\

spaceDiv.style.width=%@+\"px\";\

spaceDiv.style.height=%@+\"px\";\

document.body.appendChild(spaceDiv);\

}",@(addViewHeight),@(myWebView.scrollView.contentSize.width),@(addViewHeight)];

[myWebView evaluateJavaScript:jscompletion Handler:nil];

如果有更好的解决办法。还请大家不吝赐教。

你可能感兴趣的:(WKWebView 底部页面被遮挡 显示不全)