Question

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

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

不使用额外空间并出现边距。在Safari中缩小文本和图像大小的结果，但实际使用了额外的空间。

我正在使用InterfaceBuild和XIB文件连接视图。

另外，我在viewDidLoad中启用放大。

webView.allowsMagnification = YES;

我也试过以下但没有成功：

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

任何暗示都会非常感激。

Answer 1

要尽可能接近Cmd +/-在Safari / Chrome中的功能，我增加了WKWebView的框架，然后反过来变换了该层：

    var zoomLevel: CGFloat = 1

    private func didTapZoomOut() {
        zoomLevel -= 0.2
        needsLayout = true
    }

    override func layout() {
        super.layout()
        webView.frame.size = CGSize(width: frame.width * (1/zoomLevel), height: frame.height * (1/zoomLevel))
        webView.layer?.transform = CATransform3DMakeScale(zoomLevel, zoomLevel, 1)
    }

这也会导致滚动条缩小，但是对于我的用例而言，这并不重要。

Answer 2

问题在于WKWebView的放大属性无法达到您的预期。它的作用是将渲染的页面整体缩放（考虑获取位图或图像并调整其大小）。

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

没有像Safari一样可以放大页面的本机（公共）API，但是您可以利用CSS documentation来做几乎相同的事情。这是一个扩展，可以做到这一点：

extension WKWebView {

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

}

可以这样使用：

webView.zoom(to: 0.9)

Answer 3

@mattsven的答案似乎是正确的。这是他的解决方案的客观c变体：

NSString *jsCommand = [NSString stringWithFormat:@"document.body.style.zoom = 1.5;"];
[[wkWebView evaluateJavaScript:jsCommand completionHandler:^(NSString *result, NSError *error) {
if(error != nil) {
    NSLog(@"Error: %@",error);
    return;
}

NSLog(@" Success");
}];

WKWebView似乎没有scalePagesToFit作为iOS的UIWebView。

参考文献。one two

WKWebView - 放大后内容不合适

3 个答案: