Getting size of styled UIWebView content - Not quite working

Question

This seems like a common problem, but I'm unable find an adequate solution. I'm trying to re-size a bunch of UIWebViews to fit their content, but it doesn't seem to work properly. The best solution I've found so far is this answer, but it only appears to work occasionally in my solution. The idea is to re-size the UIWebView in the webViewDidFinishLoad: delegate method. However, this still doesn't get the right size. If I trigger the update at some undefined time after webViewDidFinishLoad:, the content does get sized correctly.

I will describe my situation below, and I'll paste relevant source on Gist.

Problem Description

I have a situation where I'm getting data from a JSON API and displaying the data in webviews. The API returns an array of objects, and each object has a "content" field with HTML-formatted text. The designers have given a structure which involved a (mostly) hidden view that you swipe up to reveal, which contains a scroll view of all the content, formatted in a very particular way.

To implement this, I have three view controllers: The main view controller, the secondary view controller which you swipe up on the main view controller to reveal, and a tertiary view controller that displays one item of html-formatted content from the JSON API results.
The secondary view controller contains a UIScrollView and an array of tertiary view controllers. Each tertiary view controller contains a UIWebView to display the HTML-formatted content, and labels for displaying other attributes of the JSON object. Because the tertiary views will be displayed inside a UIScrollView in the secondary view, the tertiary views' UIWebView needs to be re-sized to fit its content and have user interaction disabled in order to prevent a confusing scroll-view-in-scroll-view scenario.

The process to get all this to work is as follows:

1. First, on the Primary controllers ViewDidLoad, load up and display the secondary view and an activity indicator so the UI does not appear to freeze
2. Next, load the data from the JSON API
3. When the data from the API has loaded (notified via a delegate), construct tertiary view controllers, set their attributes from the loaded data and add them to the secondary controller's list.
4. Once that is finished, call the Secondary controller's setup method. This method loops through the list of tertiary controllers and calls their setup methods in turn
5. Each tertiary controller's setup method sets the text for the labels and sets the content for the UIWebView using loadHTMLString: with a pre-defined html file's content, with the content of the JSON object substituted in.
6. On the tertiary controller's webViewDidFinishLoad: delegate method, using the method at this answer, re-size the web view based on the content size.
7. Re-size the tertiary controller's view to fit the web view and position any labels that go underneath the web view
8. The tertiary controller then calls a delegate method to notify the secondary controller that it has finished loading. The secondary controller keeps tabs on which of its tertiary controllers have finished loading.
9. When all tertiary controllers are finished loading, the secondary controller loops through its list and adds the tertiary views to it's UIScrollView's content, adjusting frames and the content height as it goes.

Answer 1

If you are using iOS 5.0, you could probably use webview.scrollView.contentsize, otherwise you can also get the content size through javascript.

CGFloat newHeight = [[webView stringByEvaluatingJavaScriptFromString:@"document.body.offsetHeight;"] floatValue];

or alternatively

CGFloat newHeight = [[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollHeight;"] floatValue];

Answer 2

I know you have a solution, but I just worked through this problem myself, and I came up with a simple yet stupid answer.

At first my UIWebView would only grow, but never shrink. So I started by trying to set the frame size, but it would try to scroll on a too small frame, so instead I set the contentSize.height to 1 every time I loaded something into it. My finish load looked something like this

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    NSLog(@"--- webViewDidFinishLoad (pre sizeToFit) webview.frame = %@", NSStringFromCGRect(_detailsWebView.frame));
    NSLog(@"--- webViewDidFinishLoad (pre sizeToFit) scrollview.contentSize = %@", NSStringFromCGSize(_detailsWebView.scrollView.contentSize));
    [_detailsWebView sizeToFit];
    NSLog(@"--- webViewDidFinishLoad (post sizeToFit) scrollview.contentSize = %@", NSStringFromCGSize(_detailsWebView.scrollView.contentSize));
    NSLog(@"--- webViewDidFinishLoad (post sizeToFit) webview.frame = %@", NSStringFromCGRect(_detailsWebView.frame));
}

but this gave me output like

[8431:707] --- webViewDidFinishLoad (pre sizeToFit) webview.frame = {{20, 11}, {663, 757}}
[8431:707] --- webViewDidFinishLoad (pre sizeToFit) scrollview.contentSize = {663, 1}
[8431:707] --- webViewDidFinishLoad (post sizeToFit) scrollview.contentSize = {663, 92}
[8431:707] --- webViewDidFinishLoad (post sizeToFit) webview.frame = {{20, 11}, {663, 1}}

It now worked as long as my "new" content was bigger than my old content, but if the content shrank, it had issues. It turns out, somehow sizeToFit was updating the frame of the webview before it updated the contentSize

I was able to fix this by manually updating the frame from the contentSize after I called sizeToFit and ultimately, I wound up just calling sizeToFit twice in a row.

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    [_detailsWebView sizeToFit];
    [_detailsWebView sizeToFit];
}

And it works. I can't say I'm happy with such a solution and I'm striving to make it better, but it works and the code it extremely simplistic.