Lesson 10

Introduction to Storyboards

Most iOS applications are made up of several screens of content with the user typically navigating from one screen to another. A storyboard is a feature in Xcode that lets you view all the screens as well as the connections between them in a single place. In general, storyboards provide a better high-level overview of all the screens in your application and the relationships between them.

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. When you create a new project from any of the iOS Application templates, Xcode creates a single storyboard file for you called Main.storyboard (see Figure 10.1).

Screenshot of a storyboard screen with Main.storyboard option grayed.

Figure 10.1

Figure 10.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 dark gray outline around it.

Screenshot of a storyboard screen with two scenes.

Figure 10.2

Toward the upper portion of the selected scene ...

Get Swift iOS 24-Hour Trainer now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.