UIWebView自动旋转会破坏Web视图内容（内部有截图）

Question

我遇到了UIWebView自动旋转的问题。
网页视图可以拉伸，但内容却不能。
正如您在底部截图中看到的那样，有一个黑色边缘，我知道这是网页视图，因为当我滚动时可以看到滚动条。
视图控制器包含：

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation 
{
    return YES;
}

Webview具有完整的自动调整大小掩码，视图是自动调整子视图。
我尝试了许多在stackoverflow和谷歌上找到的技巧，但都没有奏效。这种情况只会在某些网站上发生，但如果我在移动safari或甚至ios opera浏览器中打开有问题的网站，它就可以正确旋转。
编辑：一个有问题的网站示例：http://m.calcalist.co.il
Webview在界面构建器中设置，并使用以下代码加载：

[_webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://m.calcalist.co.il"]]];

scalesPageToFit = YES; // doesn't help

谢谢！

- Or Arbel

---

你能请添加关于webview的代码吗？你如何创建和放置？ - Janak Nirmal

你能提供这样一个网站的地址吗？ - sergio

一个有问题的网站示例：http://m.calcalist.co.il - Or Arbel

Answer 1

在 willAnimateRotationToInterfaceOrientation 方法中设置框架，然后设置元标签。

另外，您可以设置 UIWebView 的此属性：

webView.autoResizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;

- DivineDesert

---

这个解决方案对我有效，而不是被选中的答案。 - temple

是的，这个可以工作，但代码中有一个错误：autoResizingMask => autoresizingMask，'R'不应该大写。 - Jimmy

Answer 2

您可以将Web视图的 scalesPageToFit 属性设置为YES。

如果是自己生成HTML，则还可以设置 viewport meta 标签。

如果页面已经设置了视口，则可以将您的视图控制器设置为Web视图的委托，并像这样更改它：

- (void)webViewDidFinishLoad:(UIWebView *)webView {

    NSString *javaScript = @"var metatags = document.getElementsByTagName('meta'); \
    for(cnt = 0; cnt < metatags.length; cnt++) { \
        var element = metatags[cnt]; \
        if(element.getAttribute('name') == 'viewport') { \
            element.setAttribute('content','width = device-width; user-scalable = yes'); \
        } \
    }";
    [webView stringByEvaluatingJavaScriptFromString:javaScript];
}

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation {

    if ([self interfaceOrientation] == UIInterfaceOrientationPortrait)
        [webView stringByEvaluatingJavaScriptFromString:@"document.body.style.zoom = 1.0;"];
    else
        [webView stringByEvaluatingJavaScriptFromString:@"document.body.style.zoom = 1.5;"];
}

- Morten Fast

---

你提到的网站(m.calcalist.co.il)将视口设置为320的宽度，因此它不会比这更宽。问题在于页面设计有误，而不是你的实现。 - Morten Fast

更新了我的答案，展示如何打破限制性视口。 - Morten Fast