以编程方式更改WKWebView内容大小

Question

我在PhoneGap / Cordova 4.0+应用程序（通过cordova-plugin-wkwebview-engine）和used programmatic AutoLayout constraints中添加了WKWebView子视图，以使WKWebView的大小与MainViewController的视图相同。

当我查看WKWebView的边界时，它与MainViewController视图的边界匹配。

但是使用Javascript to inspect the content size，特别是看起来像的脚本：

var body = document.body; 
var html = document.documentElement;
Math.max(body.scrollHeight,body.offsetHeight,html.clientHeight,html.offsetHeight);

这返回的高度实际上是WKWebView边界高度的1/2到2 / 3rds（在iPad Pro模拟器上我将边界高度设置为1024.0，但Javascript报告的内容高度仅为735.0）。我只展示了我希望展示的非调整大小的Vue.js内容的一半。

由于我无法显示我正在使用的实际内容（NDA好玩！），我实际上发现问题发生在任何 URL我传递到PhoneGap / Cordova中的WKWebView。以下是apple.com在我的应用中的样子：

以下是应该的样子，正确大小的版本，在Mobile Safari中（在模拟器中运行）：

您可以看到顶部条形项目的间距不同（在桌面上它们应该从窗口的任一侧稍微缩进）并且在底部边缘显示更多，因为Web视图的内部高度更高。

为了解决我的问题，我已经做了所有事情，从将{WKWebView实例化从viewDidLoad移到viewDidAppear，还尝试了“硬编码”传递给{的静态iPad Pro大小的帧大小{1}}，但内容大小仍为735.0。同样的内容在Simulator的Mobile Safari和Desktop Safari中都能很好地（和正确地）呈现。

如何强制WKWebView的内容大小与父视图的界限相匹配？

如果你想在iPad Pro模拟器上看到这个错误，我在https://github.com/dautermann/phonegap-air有一个公共github回购。请务必获取"demonstrate-issue"分支。

Answer 1

简答：

您需要在contentSize的{​​{1}}方法中检查WKNavigationDelegate，直到此处您只使用JavaScript代码获得735.0 webView:didFinishNavigation:。

稍长一点的回答

当您创建contentSize时，其WKWebView在[{1}} frame中的大小相同。它不会发生变化，直到自动布局发挥其魔力，即initwithFrame中的frame方法。

此时，您的viewDidLayoutSubviews覆盖了主视图，但您的网站UIViewController并非您的预期。因为你的网站还没有。

您需要设置WKWebView来收听导航事件。在通过contentSize方法调用webView.navigationDelegate = {delegate}之前，您的网站不是100％。从现在开始，您可以衡量预期的delegate值。

希望有所帮助。

Answer 2

我认为您遇到的问题与WebView没有直接关系。这与以下事实有关：出于向后兼容的原因，旧的＆＃34;在iPad Pro上运行的应用程序无法获得＆＃34;原生分辨率＆＃34;而是使用iPad 1024x768。

说服Apple了解iPad Pro及其原生分辨率的方法是指定一些LaunchScreen故事板。是的，这有点令人惊讶，但就是这样（例如参见https://forums.developer.apple.com/thread/17193）。如果我在GitHub上修改测试项目中的OTAApplication目标并将标准CDVLaunchScreen指定为Launch Screen File，那么一切正常。

更新

根据Force iPad Pro to full resolution without Launch Screen，如果您使用XCode 8，那么仅为iPad Pro指定适当分辨率的启动图像就足够了。但是哈文没试过。