How to Create / Manage / Use Storyboards with Storyboard References

maaz uddin

Published on 07 Jul.

    Want to be a part of Awesome Tech family?

    Bring to the table win-win survival strategies to ensure proactive domination.


    Storyboards were introduced by Apple to simplify the lives of iOS app developers. But some underlying complexities made the developer reluctant towards adopting the storyboards in their designing process. In order to overcome these barriers Apple introduced Storyboard References with iOS 9. The purpose of storyboard references is to make it easier to employ storyboards in projects.
    This post will guide you on how to create storyboard references.

    Why Storyboards were difficult to use?

    Storyboards were great to visually represent the graphic user interface. But they posed difficulty while working on larger projects. Moreover, the storyboard was saved as one file which lead to merge conflicts when multiple users made changes to the source file.

    How Storyboard References can overcome the issues?

    Storyboard references enable you to use storyboard multiple times by referencing it. This allows you to divide storyboard into smaller storyboards. With multiple storyboards, different members of the team can work independently. It also eliminates the issues pertaining to merge conflicts and navigation problems.

    How to use Storyboard References?

    To help you understand the process of storyboard references, I will demonstrate a project from the beginning. In order to work on storyboard reference you will need Xcode7 as it only works on iOS9.
    After installing Xcode7, simply follow the following steps.

    1. Open Xcode7 and create a new project.
    2. Choose Tabbed Application from iOS as your project template.
    3. Configure your project by entering name and other details. Choose iPhone as the device.
    4. Select location to store your project and press Create.

    As soon as you complete, you will see that Xcode has created two storyboards i.e. Main.storyboard and LaunchScreen.storyboard. We will be using Main.storyboard which contain the user interface of the application.
    The Main.storyboard will include a tab bar controller and two view controllers.
    Now in order to create the user interface, embed view controllers in the navigation controllers. Your storyboard should look like this.
    Multiple module make the storyboards more complex. Using storyboard references in this situation can help demonstrate its importance in making things simpler.
    Refactoring Storyboards
    Refactoring is a process through which storyboards are broken into smaller storyboards. You can select a scene and then refactor it into small code. To do so, select first view controller and its respective navigation controller. Go to editor’s menu and select Refactor to Storyboard. Name the storyboard and save it.
    This will make Xcode to create a new storyboard with view controller and its root navigation controller and saves a reference point in Main.storyboard in its replacement. Clicking the reference point will open the new storyboard which it references in the Main.storyboard.
    The storyboard references is a powerful tool that help iOS app developer to organize storyboards and reference them for reuse.

    Leave a comment