UIWebView——加载外部网站，以编程方式设置初始缩放比例，并允许用户随后缩放

Question

是否可以完成以上所有操作？ SO给了我一个很好的方法来设置初始缩放比例这里。也就是说，在我的 webViewDidFinishLoad 方法中包含以下行：

[webView stringByEvaluatingJavaScriptFromString: @"document.body.style.zoom = 5.0;"];

但我仍然不能做的是允许用户在程序最初设置缩放比例后更改缩放比例。如果我将scalePagesToFit 设置为NO，则用户无法更改缩放比例。如果我将scalePagesToFit设置为YES，它会覆盖我的编程缩放。

有人可以帮忙吗？

编辑：感谢您的回复。但是如果我缩放滚动视图，事情就会变得有点模糊。

Answer 1

您可以添加或修改 标记来实现此目的。有关元/视口标签的 Apple 文档位于此处：

https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html

这是添加文档加载后添加标记：

- (void) webViewDidFinishLoad:(UIWebView *)webView
{
    NSString* js = 
    @"var meta = document.createElement('meta'); " \
     "meta.setAttribute( 'name', 'viewport' ); " \
     "meta.setAttribute( 'content', 'width = device-width, initial-scale = 5.0, user-scalable = yes' ); " \
     "document.getElementsByTagName('head')[0].appendChild(meta)";

    [webView stringByEvaluatingJavaScriptFromString: js];        
}

如果您正在加载的网页提供了现有的元标记，您可能需要修改它，而不是尝试向 DOM 添加新的元元素。这个SO问题讨论了该技术：

我可以动态更改移动 safari 中的视口元标记吗？

在我的测试应用程序中，我将 UIWebView scalesPageToFit 设置为 YES。

Answer 2

看起来底层的 UIScrollView 从 iOS 5.x 开始就可以访问。

在 webViewDidFinishLoad: 中，您可以请求缩放，例如：

[webView.scrollView zoomToRect:CGRectMake(0.0, 0.0, 50.0, 50.0) animated:YES];

即使将 scalesPageToFit 设置为 YES，这似乎也能工作。

Answer 3

这实际上很棒。我需要具有缩放功能，而scalePagesToFit 是“否”。虽然你的代码 TomSwift 没有按照我的需要工作，但对其进行轻微调整就可以了。

我在 iOS 6.x 上运行这个...效果非常好。

NSString* js =
        @"var meta = document.createElement('meta'); " \
        "meta.setAttribute( 'name', 'viewport' ); " \
        "meta.setAttribute( 'content', 'width = device-width, initial-scale=1.0, minimum-scale=0.2, maximum-scale=5.0; user-scalable=1;' ); " \
        "document.getElementsByTagName('head')[0].appendChild(meta)";

[webView stringByEvaluatingJavaScriptFromString: js]; 

很棒的提示汤姆。

Answer 4

尝试更改设置这些命令的顺序 - 首先将scalePagesToFit设置为YES，然后：

[webView stringByEvaluatingJavaScriptFromString: @"document.body.style.zoom = 5.0;"];

Answer 5

与我的答案的不同之处在于您在设置宽度之前清除视口。

这允许 Web 视图旋转或调整大小（加载后），而无需重置属性更改。

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    // Clear view port
    NSString* js = @"$('meta[name=viewport]').remove();";
    [webView stringByEvaluatingJavaScriptFromString: js];

    // Set content size
    js = [NSString stringWithFormat:@"var meta = document.createElement('meta');"
          "meta.setAttribute( 'name', 'viewport' ); "
          "meta.setAttribute( 'content', 'width = device-width, initial-scale = 5.0, user-scalable = yes' ); "
          "document.getElementsByTagName('head')[0].appendChild(meta);"];

    [webView stringByEvaluatingJavaScriptFromString: js];
}