时间戳

首页 > 解决方案 > WKWebView - 放大后内容不合适

objective-c - WKWebView - 放大后内容不合适

问题描述

我WKWebView在设置放大属性时遇到问题。

我希望内容能够像在 Safari 中一样调整大小以适应它。但我无法做到这一点。将放大倍率设置为小于 1.0 的值时如下所示。

在此处输入图像描述

多余的空间没有被使用，并且出现了边距。在 Safari 中，缩小会导致文本和图像变小，但实际上会使用额外的空间。

在此处输入图像描述

我正在使用带有 XIB 文件的 InterfaceBuild 来连接视图。

在此处输入图像描述

在此处输入图像描述

在此处输入图像描述

另外，我在viewDidLoad.

webView.allowsMagnification = YES;

我也尝试了以下但没有成功：

webView.translatesAutoresizingMaskIntoConstraints = NO;
webView.autoresizesSubviews = NO;
webView.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;

任何提示将不胜感激。

标签： objective-ccocoawkwebview

解决方案

问题是WKWebView的 magnification 属性并不像你认为的那样。它的作用是将渲染的页面作为一个整体进行缩放（考虑获取位图或图像并调整其大小）。

您想要的是 Safari（和其他浏览器）具有的动态缩放功能，通常称为“缩放”。这与 不同magnification，因为它会缩放页面的布局。这会单独放大或缩小页面的字体大小、元素大小等。

没有像 Safari 那样缩放页面的本地（公共）API，但您可以通过利用 CSSzoom属性来做几乎相同的事情。这是一个可以做到这一点的扩展：

extension WKWebView {

    func zoom(to zoomAmount: CGFloat) {
        evaluateJavaScript("document.body.style.zoom = '\(zoomAmount)'", completionHandler: nil)
    }

}

它可以这样使用：

webView.zoom(to: 0.9)

推荐阅读