根据内容字体大小动态调整UIWebView大小

Question

我有一些需要在我的应用程序中显示的文本。这个文本包含需要交互的链接。我已经尝试了一些解决方案，使UITextView和UILabel中的链接可点击。

1. UITextView 链接

   • UITextView 提供数据检测器，可以识别URL并使它们可点击。
   • 对我来说无法使用，因为链接只会在Safari中以外部方式打开，没有办法控制并按照我的意愿进行操作。

2. 使用“Fancy Labels” (http://furbo.org/2008/10/07/fancy-uilabels/) 的 UILabel 链接

   • 几乎是完美的解决方案，提供链接检测以及用户内联查看和点击它们的方式，并且当链接被按下时给我完全的控制权。
   • 目前无法使用，因为实现使用UIButton来覆盖链接，而长链接时它们不会与文本换行。

最后，我选择使用Web视图。我将文本传递到Web视图中，并在其周围构建一个基本的HTML包装器，一切都很好。这是Twitter for iPhone（又名Tweetie）使用的相同方法。

我现在唯一的问题是，如果文本太长，Web视图会裁剪溢出并滚动以查看裁剪的文本。其次，如果文本太短，则Web视图下方会有大量浪费的空间。

与Tweetie不同，我在Web视图下面有更多内容，并且我希望避免滚动溢出或浪费的空间。无论如何，Web视图都是滚动视图的子视图，因此整个页面的内容可以增长而不需要滚动其子视图。

是否有任何方法可以动态调整Web视图的大小，使其基于其内容具有适当的高度？

到目前为止，我已经尝试了许多方法，但似乎没有一个可靠的解决方案：

• sizeToFit 没有作用（或者更可能是将大小设置为当前框架的大小）。
• sizeThatFits: 返回其当前大小。
• NSString 的 sizeWithFont:constrainedToSize: 不可行，因为 UIWebView 和 UIFont 对大小18有不同的表示方式。
  • 仅就此点进行阐述。在我的测试中，我发现具有比例因子1.0并且将 scalesPageToFit 设置为 NO 的webView以及整个页面设置为13.5pt（在CSS中）的字体大小会呈现与大小为18的 UILabel 相同大小的文本。如果有人能解释给我听，我会很感激。
• 另外，在我使用的 webView 中，我使用 CSS 属性 word-wrap: break-word; 以防止长单词或 URL 横向滚动。因此，webView 和 UILineBreakModeWordWrap 之间的换行行为完全不同。即使使用 UILineBreakModeCharacterWrap 也无法产生相同的结果。

要么没有方法可以做到这一点，要么我太傻了，错过了一些简单的东西。如果有人能提供一些见解，我会非常感激。谢谢。

- Jasarien

Answer 1

实际上，你可以通过一些技巧使用-sizeThatFits：。请参见我的回答来解决类似的问题。

- Ortwin Gentz

Answer 2

我在http://www.iphonedevsdk.com/forum/iphone-sdk-development/1388-getting-actual-content-size-uiwebview.html找到了解决问题的方法。

虽然我不是很确定它是否是最好的解决方案，但它有效。如果有更好的想法，请告诉我。

我最终在webViewDidFinishLoad:中运行了JavaScript代码。我的内容被一个名为“body”的单个div元素包装，所以我的代码如下：

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    NSString *string = [_webView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"body\").offsetHeight;"];
    CGFloat height = [string floatValue] + 8;
    CGRect frame = [_webView frame];
    frame.size.height = height;
    [_webView setFrame:frame];

    if ([[self delegate] respondsToSelector:@selector(webViewController:webViewDidResize:)])
    {
        [[self delegate] webViewController:self webViewDidResize:frame.size];
    }
}

我不得不稍微增加高度，因为原始值没有考虑到边距大小等因素。

在获取高度后，我回调我的代理，告诉它webview已经调整大小，以便进行布局。

- Jasarien