WKWebView + contentInset使内容大小错误

Question

在iOS上，当您在contentInset的滚动视图上设置WKWebView时，似乎会让网页视图认为网页内容比实际大。例如，如果您将一个大部分为空的页面设为顶部或底部contentInset，即使没有任何内容可以滚动，您也可以向下滚动页面。

这是预期的行为吗？是否有一种解决方法仍允许我使用contentInset？

Answer 1

问题是WKWebView似乎总是使用其框架作为其视口大小，而忽略了减去scrollView的contentInset。我可以通过workaround找到stephan-leroux。

我们的想法是手动或使用自动布局约束将WKWebView框架设置为所需的视口大小。要恢复＆＃34;滚动下＆＃34; contentInset的效果，请停用scrollView＆＃39; masksToBounds：

wkWebview.scrollView.layer.masksToBounds = NO;

Answer 2

weiyin的suggestion（调整网页视图的框架）为我工作。

只是想分享一个代码示例：

CGFloat topInset = ...;
web.scrollView.layer.masksToBounds = NO;
[web.scrollView setContentInset:UIEdgeInsetsMake(topInset, 0, 0, 0)];
[web setFrame:CGRectMake(0, 0, web.width, web.height-topInset)];

Answer 3

四年后，问题仍然存在...

weiyin's answer的效果很好，但是如果您像我一样，可能会想尽办法确切地做些事情（尽管这确实很简单）。

因此，这是对假人（如我）的简单解释：

1. 将您的 Web视图嵌入到包装器视图中。

2. 调整大小和位置 Web视图，使其框架从包装器视图精确插入所需的内容。

3. 在 Web视图的滚动视图上设置clipsToBounds = false（在 Wrapper视图的true上）。

4. 确保在 Web视图（webview.contentInset = .zero）上没有设置任何内容插图。

   （这是默认设置，通常不需要设置）。

完成：

• 在 Web View 上100％的内容插入行为，而没有使用内容插入。