This project is a self-contained example done completely in the Interface Builder. You should be able to work through it in 10 minutes or less. Then you can apply the concepts you learned to your own project.

http://i.stack.imgur.com/L4puB.gif

Here I just use UIViews but they can represent whatever view you like (ie, button, label, etc). I also chose horizontal scrolling because the storyboard screenshots are more compact for this format. The principles are the same for vertical scrolling, though.

Key concepts

Start a new project

It can be just a single view application.

Storyboard

In this example, we will make a horizontal scroll view. Select the View Controller and then choose Freeform in the Size Inspector. Make the width 1,000 and the height 300. This just gives us the room on the storyboard to add content that will scroll.

http://i.stack.imgur.com/sWjKD.png

Add a Scroll View

Add a UIScrollView and pin all four sides to the root view of the view controller.

http://i.stack.imgur.com/o8WKv.png

Add a Content View

Add a UIView as a subview to the scroll view. This is key. Don’t try to add lots of subviews to the scroll view. Just add a single UIView. This will be your content view for the other views you want to scroll. Pin the content view to the scroll view on all four sides.

http://i.stack.imgur.com/h70fZ.png

Equal Heights

Now in the Document Outline, Command click both the content view and the scroll view’s parent view in order to select them both. Then set the heights to be equal (Control</kbd drag from the Content View to the Scroll View>). This is also key. Because we are scrolling horizontally, the scroll view’s content view won’t know how high it should be unless we set it in this way.