Dynamic height of UIWebView with auto layout

Question

I have a problem with setting the height of an UIWebView dynamically. The webview loads a product description which contains html. I want the UIWebView to change its height based on the contents of the description. The parent scrollview should also change its height, but then based on the height of the UIWebView.

Can anyone explain to me how I can achieve the desired behavior of my views?

This is my view hierarchy:

enter image description here

Possible duplicate of http://stackoverflow.com/questions/10715524/calculate-uiwebview-height-depending-on-its-content ??? — Master Stroke, Aug 21 '13 at 11:06
Possible duplicate of [How to determine the content size of a UIWebView?](http://stackoverflow.com/questions/3936041/how-to-determine-the-content-size-of-a-uiwebview) — Fattie, Jul 08 '16 at 18:42

score 9 · Answer 1 · answered Nov 19 '13 at 19:46

You have to add some code in the delegate method of UIWebView named webViewDidFinishLoad. Here is what you can do:

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
      CGRect frame = webView.frame;
      frame.size.height = 1;
      webView.frame = frame;
      CGSize fittingSize = [webView sizeThatFits:CGSizeZero];
      frame.size = fittingSize;
      webView.frame = frame;

      NSLog(@"size: %f, %f", fittingSize.width, fittingSize.height);

      yourScrollView.contentSize = webView.bounds.size; 
}

The same thing can also be achieved using javascript to find the right height which is as follow:

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    CGRect oldBounds = [[self webView] bounds];
    CGFloat height = [[webView stringByEvaluatingJavaScriptFromString:@"document.height"] floatValue];
    NSLog(@"NEW HEIGHT %f", height);
    [webView setBounds:CGRectMake(oldBounds.origin.x, oldBounds.origin.y, oldBounds.size.width, height)];
    yourScrollView.contentSize = webView.bounds.size;
}

Hope it helps!

To get accurate result, Use observer for contentSize to webView.scrollView — Rajesh73, Aug 09 '17 at 09:16

score 5 · Answer 2 · answered Nov 19 '13 at 18:55

5

I actually had the same problem recently and ended up figuring it out and putting together a sample project on github.

answered Nov 19 '13 at 18:55

shawnwall

4,549
1
27
38

For the record, I have searched high and low for this, and your project was the best help in getting all the auto layout constraints sorted out. – tng Feb 04 '15 at 04:42

score 0 · Answer 3 · answered Aug 21 '13 at 11:08

0

You can set a constant height constraint on your WebView and change that dynamically once you calculate the height from the response.

Also constraint between a child view and a parent view can be achieved by this method in NSLayoutConstraint

+ (id)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2 attribute:(NSLayoutAttribute)attr2 multiplier:(CGFloat)multiplier constant:(CGFloat)c

answered Aug 21 '13 at 11:08

nithinbhaktha

723
5
8

I have a constant height constraint on the webview, how and where can I change the height? Is is in the webviewdidfinishload method? – ruhu Aug 21 '13 at 12:01

Dynamic height of UIWebView with auto layout

3 Answers3