设置 WKWebView scrollView 的 contentInset 导致页面跳转到顶部

Posted

技术标签:

【中文标题】设置 WKWebView scrollView 的 contentInset 导致页面跳转到顶部【英文标题】:Setting contentInset of WKWebView scrollView causes page jump to top 【发布时间】:2018-11-19 12:00:26 【问题描述】:

在设置contentInsetWKWebView 之后,我发现如果我使用默认的滑动手势在页面之间导航,WKWebView 不会保留contentInset 而只是跳转到顶部,有谁知道如何解决这个问题?谢谢!

我的示例代码:

import UIKit
import WebKit

class ViewController: UIViewController 

    private lazy var webView: WKWebView = 
        let view = WKWebView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))
        view.allowsBackForwardNavigationGestures = true
        view.scrollView.contentInsetAdjustmentBehavior = .never
        view.scrollView.contentInset = UIEdgeInsets(top: 50, left: 0, bottom: 0, right: 0)

        view.navigationDelegate = self
        return view
    ()

    override func viewDidLoad() 
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        self.view.addSubview(self.webView)

        if let url = URL(string: "http://www.wikipedia.org") 
            self.webView.load(URLRequest(url: url))
        
    


【问题讨论】:

【参考方案1】:

如果为 WKWebView 的滚动视图设置 contentInset,则需要设置 WKWebview 的另一个具有相同值的属性。 view.setValue(UIEdgeInsets, forKey: "_obscuredInsets")

参考:https://opensource.apple.com/source/WebKit2/WebKit2-7600.1.4.11.10/ChangeLog

private lazy var webView: WKWebView = 
        let view = WKWebView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))
        view.allowsBackForwardNavigationGestures = true
        view.scrollView.contentInsetAdjustmentBehavior = .never
        let edgeInsets = UIEdgeInsets(top: 50, left: 0, bottom: 0, right: 0)
        view.setValue(edgeInsets, forKey: "_obscuredInsets")
        view.scrollView.contentInset = edgeInsets
        return view
    ()

如果你设置 contentInsetAdjustmentBehavior = .automatic,状态栏会有一个额外的边缘。您还需要将状态栏高度添加到 obscuredInsets。

view.scrollView.contentInsetAdjustmentBehavior = . automatic
webView.scrollView.contentInset = UIEdgeInsets(top: 50, left: 0, bottom: 0, right: 0)
webView.setValue(UIEdgeInsets(top: 50 + 44, left: 0, bottom: 0, right: 0), forKey: "_obscuredInsets")

44是状态栏的高度(safeArea)。


查看了最新的 WKWebView:https://github.com/WebKit/webkit/blob/master/Source/WebKit/UIProcess/API/Cocoa/WKWebView.mm

现在需要添加一个额外的属性:_haveSetObscuredInsets

webView.setValue(true, forKey: "_haveSetObscuredInsets")

【讨论】:

阿苏!拯救我的一天!

以上是关于设置 WKWebView scrollView 的 contentInset 导致页面跳转到顶部的主要内容,如果未能解决你的问题,请参考以下文章

“WKWebView”类型的值没有成员“scrollView”

实现 Scrollview 委托方法时,WKWebview Scroll 变得缓慢和滞后

将标题视图添加到 WKWebView ScrollView

SWIFT - ScrollView 内的 WKWebView 中的 HTML 滚动事件

WkWebview contentOffset 在设置动画 false 时不起作用

用WKWebView 截取整个Html页面