ios - iPhone X 上的 WKWebView 页面高度问题

Question

我发现如果我将 WKWebView 与

viewport-fit=cover

和

body :{height:100%}

html body 的高度仍然不能到达iPhone X 的底部，等于safeArea 的高度，但是background-color 可以覆盖全屏。

https://ue.qzone.qq.com/touch/proj-qzone-app/test.html

我在全屏 WKWebView 中加载此页面以重现该问题。

Answer 1

我能够使用(ObjC/Swift)解决问题:

if (@available(iOS 11.0, *)) {
  webView.scrollView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;
}

或

if #available(iOS 11.0, *) {
    webView.scrollView.contentInsetAdjustmentBehavior = .never;
}

此设置似乎与 viewport-fit=cover 具有相同的效果，因此如果您知道您的内容正在使用该属性，则可以通过这种方式修复错误。

env(safe-area-inset-top) CSS 声明仍然按预期工作。 WKWebView 会自动检测其视口(viewport)何时与屏蔽区域相交并相应地设置值。

contentInsetAdjustmentBehavior 的文档和 its parameter values和 kudos to @dpogue对于我找到解决方案的答案。