How to Pass Data Between iOS Views in Swift.

How to Pass Data Between iOS Views in Swift.

[ Updated for Xcode 9 and Swift 4 ]

This tutorial will walk you through the process of passing data from one view to another in an iOS application using Swift. Let’s get started!

There are a few steps to the process but once done you will see it is pretty simple to do provided you get everything in place. I am going to step over a few of the details that I think by now you should be familiar with like creating a new project, outlets, and actions. If these are still a little new to you I strongly recommend looking through some of my other articles that cover those topics and more

First, create a new Swift based iOS project with a single view to keep the code base to a minimum and allow us to focus on the details we are really interested in.

Now create a second view controller by searching and dragging one from the object library (lower right panel, third icon). We will pass two simple strings between the views, so for the first viewController add two text entry fields and a button. For the second add two labels to display the text entered on the first view.

To pass the data and switch views we use a segue, (I have added an extra step here in case I want to do anything extra when the button is clicked), right-click the button and drag to the second view controller and release. From the popup menu select Action Segue > show, this sets up the segue to take place when the button is pressed. See the video below if you need extra help to make sense of it.

 

Make sure you are using the first view controller and open the assistant editor (the second icon on the right-hand side of the Xcode icon bar), you should see the viewController.swift file appear. Right-click and drag from the first text entry field to the controller code and create an @IBOutlet named ‘fieldA’, then do the same with the second text entry field and name it ‘fieldB’. I also added an @IBAction for the button but it is not needed for the segue to take place, I just added it in case I want to do some extra things when it is clicked. The code for the view controller should now look something like this.

The icon that you see between the two views is called a segue, you will most likely end up using more than one in an application so for that reason I strongly recommend naming them all so they can be uniquely identified in code. So go ahead and click on the segue icon and in the right hand side attributes view, give it the name ‘btnSubmitSegue’ as seen in the screenshot below.

For the second viewController, we are going to create our own UIViewController class as the one provided has a lot of code that you just do not need to be confused with at this time! So in the file menu create a new iOS Cocoa Touch Class.

06 - New iOS Cocoa Touch Class

I named my class ‘SecondViewController’, make sure you have the language set to Swift.

07 - SecondViewController Class Creation

Next we need to assign our new custom view controller class to our view, to do that select the second view controller and in the right-hand identity inspector panel under ‘Custom Class’ in the field named ‘Class’ enter the name of the file you just created, in my case ‘SecondViewController’, you should notice as you start typing it that autocomplete will try and help you out. A little side tip here is that Xcode is great at trying to help you complete many things, so if you find autocomplete is not working then it might be a sign you got something wrong.

The assistant editor for the second view controller should now be showing the nice clean version of our new class file. Right-click on the labels in the view and one by one drag to the code window to create two new @IBOutlets called labelA and labelB. These will be used to reference the text labels on the view and populate them with the entries from the first screen.

Now we need to add some properties to our second viewController class so that we can assign our data from the first view during the segue and hand it off to the new view. To do that create two variables, see the screenshot below. For simplicity, I called my two variables (one per display label) ‘firstDataPassed’ and ‘secondDataPassed’. Note that you will often hear this technique called ‘Dependency Injection’.

Now the next step (yes I know it seems like a lot of steps!) is to create code that assigns (injects) the entry field text to our variables in the second view, we do this by overriding something called prepareForSegue in the first viewController. As the name suggests we are overriding the default with our code, copy and paste or enter the code below in ‘ViewController.swift’ and see the screenshot for reference.

Finally! In our second viewController class file (secondViewController.swift) we need to assign the variables to the display labels when the viewDidLoad is called. This is straight forward, just look for the override func viewDidLoad() and enter the code below (again see screenshot for reference).

We are done! You have reached the rainbow, run the simulator and enter some text into the two fields then hit the button, the second view should load showing the text you entered.

 

 

Hopefully, this has cleared up some of the mystery for you and set you on a path to multi-view happiness!