Scroll a UIWebView

I struggled with this one for quite a while.  I kept searching and searching, all I could find was forums and no one seemed to have an answer!

Well, if you’re here, don’t worry, I have the answer you have been looking.  Let me show you how to make a UIWebView scrollable for your iPhone application.

The example below, is placed in your viewDidLoad function.  In the case below, I have created the objects without the use of the Interface Builder.

The first thing we need to do is create a CGRect the size of our view:

CGRect bounds = [ [ UIScreen mainScreen ] applicationFrame ];

The next thing to do is to create our UIScrollView:

UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:bounds];

We’ve initialized our scrollview the size of our entire view.  Now, we need to create our webview:

UIWebView *webView = [ [ UIWebView alloc ] initWithFrame:[scrollView bounds]];

Our webView has now been initialized with the bounds of our scrollView.  The next thing we do is load our content from our webpage:

NSURLRequest *request = [ NSURLRequest requestWithURL:url ];
 [ webView loadRequest: request ];

The following code assumes we’ve created an NSUrl called url with the website we want to load.  Once we’ve loaded our webpage, we need to tell our scrollview the size of our content.  In this case, we set it to the size of our webview that we’ve loaded:

scrollView.contentSize = [webView bounds].size;

Next, we need to add our webview to our scrollview:

[scrollView addSubview:webView];

Finally, we need to set our view as the scrollview:

self.view = scrollView;

That’s it, now your webview is scrollable!

Share

Other useful articles

Leave a comment ?

1,660 Comments.

  1. Thanks for the helpful article. I’ve noticed though that after successfully loading the webpage, [webView bounds].size is the same as it was before loading. So the contentSize is not getting the right size of the page. Do you know if there’s another way to set contentSize?

  2. Hi,
    I am interested in scrolling a document loaded by UIWebView – a PDF or word or powerpoint. I tried the DOM window.scrollByPages() command and it does not work.

  3. Uh, dood!

    The UIWebView has scrolling baked right in. No need to make it a subview of a UIScrollView and then do the viewport manipulation. None at all. I repeat, UIWebView has scrolling goodness baked in. Just use the UIWebView solo and check it out.

    Dude!

  4. doode,

    dood! how do you scroll the webview? nothing in the docs…
    could u elaborate?

  5. Well, you put your finger down and move it. Or click and drag if you’re in the sim.

    Ya. This code actually breaks the built-in scrolly goodness. :sadface:

  6. the code above is pre sdk 3 where scrolling wasn’t automatic. sounds like you don’t even need to worry anymore..

  7. What if I *NEED* to have a tiny UIWebView inside my UIScrollView?

    Then the webView can’t be scrolled at all. (The entire view scrolls instead.)

    How would I still scroll the webView when needed?

  8. What’s wrong with using a little JavaScript?

    [webView stringByEvaluatingJavaScriptFromString:@"window.scrollTo(0, 0);"];

  9. Does anyone know of a way to force the UIWebView to show the scroll bar? My client is complaining that it’s not obvious that you can scroll it.

  10. Do any other iphone apps do it by default? Check that out and if not, say it’s not support because no one else does it.

  11. The docs says:

    “Important: You should not embed UIWebView or UITableView objects in UIScrollView objects. If you do so, unexpected behavior can result because touch events for the two objects can be mixed up and wrongly handled.”

  12. How can i show more pages with uiwebview ?

Leave a Comment

Buy one of my books