How to set up UIScrollView in Interface Builder with UI elements outside the main iPhone view?

Jason picture Jason · Aug 11, 2010 · Viewed 20.1k times · Source

I am building a data entry form in my iPhone app, and there are more data fields than will fit on the screen. I figured I should put them into a UIScrollView so that the user can scroll through the form. What's the best way to build this in Interface Builder? I know that I can do it programmatically, but I'd like to do it in Interface Builder if I can. The problem is, how can I lay out UILabels, UITextFields, etc. if they fall outside of the main iPhone screen--in the part of the screen for which the UIScrollView becomes useful?

Answer

user637394 picture user637394 · May 3, 2012

The best workaround I found for this problem (which I consider embarrassing for Interface Builder) is this:

  1. place a "container" UIView inside the UIScrollView, set the size of the container UIView to what is needed (e.g. 320 x 1200) with the inspector and add your content inside that container view. (your buttons, textfields, etc).
  2. set the contentSize for the UIScrollView, in code, to be the same as the size of your container UIView. somewhere in viewDidLoad for example (e.g. scrollView.contentSize = containerView.frame.size;)
  3. To modify content beyond the scrollview's bounds in Interface Builder, you have to drag your container view outside of the scroll view each time, make your modifications, then drag your container view back inside the UIScrollView and build.