iphone - HTML 内容适合 UIWebview 而无需缩小

Question

我正在使用 UIWebView 来呈现一些 HTML。然而，虽然我的 webview 的宽度是 320，但我的 HTML 仍然显示为全宽并且可以水平滚动。

我想实现与 native 邮件应用程序相同的功能，即它适合该宽度内的所有内容而不缩小 - native 邮件应用程序如何呈现这样的 HTML？

更新

我认为使用视口(viewport)元标记会有所帮助，但我无法让它发挥作用。

这是正在发生的事情:

如您所见，内容不适合设备宽度。我已经尝试了很多 viewport 元标记的组合。以下是我尝试 Martins 建议时发生的示例。

可以找到原始 HTML here .

native mail application is like so 渲染此 HTML 的方式.

Answer 1

这就是你要做的:

在拥有 Web View 的 UI Controller 中，将其设为 UIWebViewDelegate。 然后在设置要加载的 URL 的地方，将委托(delegate)设置为 Controller :

NSString *urlAddress = @"http://dl.dropbox.com/u/50941418/2-build.html";
NSURL *url = [NSURL URLWithString:urlAddress];
NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];
[webView loadRequest:requestObj];  
webView.delegate = self;

最后实现 webViewDidFinishLoad: 来正确设置缩放级别:

此选项适用于 iOS 5.0 和 >

- (void)webViewDidFinishLoad:(UIWebView *)theWebView
{
  CGSize contentSize = theWebView.scrollView.contentSize;
  CGSize viewSize = theWebView.bounds.size;

  float rw = viewSize.width / contentSize.width;

  theWebView.scrollView.minimumZoomScale = rw;
  theWebView.scrollView.maximumZoomScale = rw;
  theWebView.scrollView.zoomScale = rw;  
}

我希望这会有所帮助...

选项 B，您可以尝试更改 HTML(此示例可以完成工作，但从 HTML 解析的角度来看并不完美。我只是想说明我的观点。它确实适用于您的示例，并且可能适用于大多数情况。 40 的插图可能可以通过编程方式检测到，我没有尝试研究。

NSString *urlAddress = @"http://dl.dropbox.com/u/50941418/2-build.html";
NSURL *url = [NSURL URLWithString:urlAddress];

NSString *html = [NSString stringWithContentsOfURL:url encoding:[NSString defaultCStringEncoding] error:nil];
NSRange range = [html rangeOfString:@"<body"];

if(range.location != NSNotFound) {
  // Adjust style for mobile
  float inset = 40;
  NSString *style = [NSString stringWithFormat:@"<style>div {max-width: %fpx;}</style>", self.view.bounds.size.width - inset];
  html = [NSString stringWithFormat:@"%@%@%@", [html substringToIndex:range.location], style, [html substringFromIndex:range.location]];
}

[webView loadHTMLString:html baseURL:url];