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

Question

有可能做到以上所有吗？ SO给了我一个伟大的方式来设定初始缩放比例在这里 。 即，要在我的webViewDidFinishLoad方法中包含以下行：

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

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

有人可以帮忙吗？

编辑：谢谢你的回应。 但是，如果我缩放scrollView，事情就会模糊不清。

Answer 1

您可以添加或修改<meta name='viewport'标记来实现此目的。 有关meta / viewport标记的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

这实际上很棒。 我需要具有缩放功能，而scalePagesToFit为NO。 虽然你的代码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 3

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

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

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

即使scalesPageToFit设置为YES这似乎也可以工作。

Answer 4

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

这允许在不重置属性更改的情况下旋转或调整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];
}

Answer 5

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

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