Monday, May 15, 2017

iOS Multiple View Controller

In this tutorial, I'm gonna show you how to create a multiple view controller and segue between the view controllers.


What is View ?


    View(UIView) class is a rectangular area on the screen. It is attached to the UIWindows and it draws their content. You've seen these views in all apps for sure. Let me tell you some views for making you to understand clearly about the views.

  • Button(UIButton) - It's just a button and it can handle some operations when the button is tapped.
  • ImageView(UIImageView) - This view is used to display images on the screen and it supports most standard formats like jpg and png files.
  • Alert Controller(UIAlertController) - It is used to display alert messages to users and you can create actions with alert controller to perform some operations.
    All views(UIButton, UIImageView, UIAlertController) are subclass of UIView. UIKit contains a huge api's to construct our apps user interface and to respond all system events, interacting with views. It also allows you to access the device features. Please click this link to know more about UIKit.

What is View Controller ?


    View Controller(UIViewController) class is used to manage a set of views and it performs some operations. For instance, when we press the login button in facebook iOS app it'll take you to another screen.

Creating a Project


  • Open Xcode and Create a new project from the file menu.
  • Select Single View Application template and click Next.
  • Give name to product, organization and organization identifier. See below image for reference.


Adding View Controller and Segue


  • Click the Main.Storyboard file.
  • Drag and drop the ViewController from the Object Library into the Storyboard

  • Create a new swift file for second view controller by way of clicking the File -> New -> Cocoa Touch Class and hit next. Note: This file is not created automatically by Xcode like first view controller. For more than one view controller, you've to create manually.
  • Give the class name for second view controller and ensure that it is a subclass of UIViewController and hit next button. Then you'll get another window, just click the create button.
  • Then click the View Controller and then in the right pane, click the identity inspector. In the Custom Class section, choose the SecondViewController from the drop down menu. 


  • Then drag and drop the label, buttons to both view controller.

  • Then we've to add segues between two controllers. Just click Go to Second View Controller button. Then ctrl and drag it into second view controller and release the ctrl button. Then it'll show some options to select, just select show under the Action Segue. It's successfully segued to the Second View Controller. Just do the same procedure for second view controller also. 




  • Just click Go to First View Controller button. Then click ctrl and drag it into first view controller and release the ctrl button. Then it'll show some options to select, just select show under the Action Segue. It's successfully segued to the First View Controller. 


  • Now when the button is clicked it'll take you to the next screen ie Second View Controller and vice versa. 
  • Now your storyboard will look like below image.

Run the App


      Now build the project and run it. Then the app will open in Simulator.




Now when you click the Go to Second View Controller then it'll you take you to the next screen ie Second View Controller and in that screen if you click the Go to First View Controller it'll take you to the previous screen ie First View Controller. That's all!

Download this project

I hope you understand about views, view controllers etc in this tutorial. If this post found useful then please don't forget to share this tutorial. Feel free to ask any questions in this tutorial. See you in the next tutorial...

Happy Coding!! 












Location:India, Tamil Nadu, Tuticorin Thoothukudi, Tamil Nadu, India