WKWebView在iOS 9.3上的viewport缩放适应功能失效。

7
在iOS 9.2中,使用固定宽度表格渲染HTML的WKWebView可能会被告知通过添加类似以下的viewport标签来缩小内容以适应设备宽度:
<meta name="viewport" content="width=device-width, shrink-to-fit=YES">

这行代码导致WKWebView有效地缩小视口,以便整个渲染页面适合视图框架而无需滚动条。例如,在纯净的单视图应用程序中在viewDidLoad中运行以下代码:
WKWebViewConfiguration *wkWebConfig = [[WKWebViewConfiguration alloc] init];
WKWebView *newWebView = [[WKWebView alloc] initWithFrame:CGRectMake(0,40,self.view.frame.size.width, self.view.frame.size.height - 40) configuration:wkWebConfig];
NSString *toRender = @"<head><meta name=\"viewport\" content=\"width=device-width, shrink-to-fit=YES\"></head><body><table width=700 style='background-color: blue; color:white; font-size=20px'><tr><td>this is some text that is long enough to exceed the width of the iphone 6 unless shrink-to-fit is applied</td></tr></table></body>";
[newWebView loadHTMLString:toRender baseURL:nil];
[self.view addSubview:newWebView];

内容呈现如下:

enter image description here

然而,这种行为在9.3中发生了改变。在9.3中运行的相同代码呈现如下:

enter image description here

(尽管在截图中看不到,但有一个水平滚动条)

在stackoverflow和其他地方搜索其他问题,似乎大多数人更喜欢9.3的行为。然而,我需要9.2的收缩适合性行为。因此,我的问题是:是否有人知道如何在9.3中获得相同的收缩适合性行为?还有人知道这个改变是故意的,还是将在随后的版本中修复的错误吗?

我的测试代码可以在https://github.com/nsolter/NSWebViewShrinkTest找到,特别是https://github.com/nsolter/NSWebViewShrinkTest/blob/master/NSWebViewShrinkTest/ViewController.m

1个回答

6
我向苹果提交了一个错误报告,以下是他们的回复:“不,我们不想维护缩小适应行为。解决方法是使用 viewport meta 标签,该标签正确描述内容的宽度。” 我试过了,如果在 viewport 标签中指定实际渲染后的 html 宽度,它将在设备宽度上正确显示。在我的示例中,如果表格宽度为 700,则指定以下内容:<meta name=\"viewport\" content=\"width=700, shrink-to-fit=YES\"> 然后页面将不会出现水平滚动条。请注意,您不能指定初始比例视口属性,否则它将不能以正确的宽度显示。这显然不太理想,因为通常在渲染之前无法知道渲染后 html 的宽度。我目前的解决方案是使用 width=device-width 先渲染一次,然后再使用宽度为 X(X 是第一次渲染后呈现页面的实际宽度)进行第二次渲染。

我也使用了width=device-width并遇到了同样的问题。你是用width=X重新加载页面吗? - anoop4real
基本上是的。实际上,我正在一个新的WKWebView中呈现它,该视图当前未显示,然后将该新Web视图替换进去。 - Nicholas Solter
1
你有一些样品吗? - anoop4real
我现在没有任何开源的东西可以分享。 - Nicholas Solter
好的!如果您有机会创建一个样本,请回复。 - anoop4real

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接