滚动视图中的 WKWebView

Question

考虑到在 Web View 之后我必须有其他元素，我如何将 WKWebView 放在 Scroll View 中。

. View ... Scroll View ....... ImageView ....... WKWebView ....... Button

See the demo image

• 问题 1：禁用 WKWebView 的滚动
• 问题 2：为 WKWebView 设置完整内容高度

查看我的sample project

Answer 1

如果您的意思是在 WKWebView 中获取 html 的内容高度以使其在 UIScrollView 中不可滚动，请继续阅读。

您需要（通过委托）观察 webView 的内容高度。我给你这些步骤，因为你很清楚自己在做什么，而且你快到了。

摆脱 webView 高度限制

@IBOutlet weak var constraint_WebViewHeight: NSLayoutConstraint!

订阅 webView 的委托

这会让你知道（当你的 webView 完成加载你的网站内容时你的控制器。

self.webView.navigationDelegate = self

符合协议

在WKNavigationDelegate 的didFinish navigation 方法中，您可以调整webView 高度约束的常数。如果你愿意，可以放一些动画:)

extension ViewController: WKNavigationDelegate {
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
            self.constraint_WebViewHeight.constant = webView.scrollView.contentSize.height
        }
    }
}

最后，修正你的约束。

一个。删除您的 imageView 底部约束。 湾。将底部约束添加到滚动视图的保存按钮。

这将使您的 scrollView 可滚动。

瞧！这会产生这个结果。

我希望这会有所帮助！

Answer 2

根据您的理解，如果页面大于您的屏幕，您希望 webview 不能很好地滚动，它会滚动吗？ 显示整页。尽管您可以使用滚动视图的对象从界面构建器或代码中将 isscrollingenabled 更改为 false。 要设置全高，请从四面八方给出约束 0,0,0,0，它肯定会延伸到整个屏幕

Answer 3

这是错误的方法。 你应该使用 WKWebView 的 scrollView。

您需要使用 javascript 为带有 h​​tml 边距的图像和按钮预留空间

[NSString stringWithFormat:@"document.body.style.margin = '%dpx %dpx %dpx %dpx'", (int)margins.top, (int)margins.right, (int)margins.bottom, (int)margins.left]

如果您可以访问它，或者直接在 html 正文中。

在 WKWebView 的 scrollView 中添加 imageview 和 button。