iPhone and iPad App 24-Hour Trainer

Chapter 5

Introduction to Storyboards

Most iOS applications are usually made up of several screens of content, with the user typically navigating from one screen to another. A storyboard is a new feature in Xcode that lets you view all the screens as well as the connections between them in a single place.

Storyboards involve two key concepts, scenes and segues. A scene is defined by a view controller and is the major visual component of a storyboard. It represents one screen of content in your application.

If you have been programming iOS applications prior to iOS5, everything you know about Interface Builder applies to scenes. To use storyboarding in your application, you must select the Use Storyboard option in the project options dialog (Figure 5-1).

Figure 5-1

Figure 5-2 shows the scenes that make up the storyboard of a simple iOS application. As you can see, each scene contains familiar UIKit controls like image views, buttons, and labels. Clicking one of the scenes in the storyboard selects it. The selected scene has a green outline around it.

Figure 5-2

At the bottom of each scene is a gray rectangle, called the dock (Figure 5-3). When a scene is selected, the dock contains icons corresponding to the top-level objects in the scene. The two icons you see in Figure 5-3 ...