iOS 6 Programming Cookbook

2.23. Creating Scrollable Content with UIScrollView

Problem

You have content that needs to get displayed on the screen, but it requires more real estate than what the device’s screen allows for.

Solution

Use the UIScrollView class.

Discussion

Scroll views are one of the features that make iOS a really neat operating system. They are practically everywhere. You’ve been to the Clock or the Contacts apps, haven’t you? Have you seen how the content can be scrolled up and down? Well that’s the magic of scroll views.

There really is one basic concept you need to learn about scroll views: the content size, which lets the scroll view conform to the size of what it’s displaying The content size is a value of type CGSize that specifies the width and the height of the contents of a scroll view. A scroll view, as its name implies, is a subclass of UIView, so you can simply add your views to a scroll view using its addSubview: method. However, you need to make sure that the scroll view’s content size is set properly, otherwise, the contents inside the scroll view won’t scroll.

As an example, let’s find a big image and load it to an image view. I will add the same image that I used in Recipe 2.22: a MacBook Air image. I will add it to an image view and place it in a scroll view. Then I will use the contentSize of the scroll view to make sure this content size is equal to the size of the image (width and height). First, let’s start with the header file of our view controller:

#import <UIKit/UIKit.h>