iOS UINavigationController Tutorial

Till now in all our examples we used only a single view screen. But any application contains many screens with a hierarchy. Like a user will see Login Screen first and then after Login user will see the profile screen. For handling multiple screens in the Storyboard we have iOS UINavigationController.

UINavigationController manages all the screens of the app. It uses a navigation stack, the bottom of the stack contains the root view and at the top we have the screen that is currently displaying. To switch between the screens we can use the push and pop method. So in this iOS UINavigationController Tutorial we will see a simple example using Swift.

Creating UINavigationController

First we will create a new iOS Single View Application.

Now come inside Main.storyboard.
Make sure your the ViewController is selected then go to Editor -> Embed In -> Navigation Controller.

Now your Storyboard will look like this.

So we have the first screen of the app. And we have given title as also First Screen.

Creating Another View Controller

As we want to deal with multiple screens. So we will create another View Controller. So drag View Controller to Storyboard.

Now we will create a swift class for this View Controller.
On the Bottom Left Corner you will see a + Sign click there and select File.

Now select Swift File and click next.

Now you will asked to give name of the file. I just given the name SecondViewController.swift.

Now open the file SecondViewController.swift and write the following code in it.

//
//  SecondViewController.swift
//  NavigationControllerExample
//
//  Created by Belal Khan on 27/10/16.
//  Copyright © 2016 Belal Khan. All rights reserved.
//

import UIKit

class SecondViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    
}

Now we need to add this class for our Second View Controller that we already created. So come inside Storyboard and select the Second View Controller.

So we have defined the class SecondViewController.swift that we just created for this View Controller.
Now we have two View Controllers.

Switching Between Views

To switch between Views we need something, in this case we will create a Button in First View Controller. And when the button is clicked we will open the Second View Controller.
So drag a button inside the First View Controller.

Now press Control and Drag this Button to your Second View Controller.

Now you will see a small popup, select push from the options.

And now your both View Controllers are connected.

I also added a title to Second View Controller, same as we did with the First View Controller.
You can also add a button to the Second View Controller and repeat the same process to come back to First View Controller from Second View Controller. (Though this is not necessary because we will get this option by default in the Title Bar of the View Controller).

Now just run the application in Simulator.

So it is working absolutely fine.

Thats all for this iOS UINavigationController Tutorial friends. In next tutorial we will learn how to create User Registration and Login Options in our iOS Application using MySQL Database and PHP. And don’t hesitate to leave you comments if you are having some confusions regarding this iOS UINavigationController Tutorial. Thank You 🙂

iOS UINavigationController Tutorial – Displaying Multiple Screens