0 1 00:00:00,750 --> 00:00:07,170 In the previous lessons, we've been learning a lot about inheritance and managing our screens using a 1 2 00:00:07,170 --> 00:00:09,380 UIViewController. 2 3 00:00:09,420 --> 00:00:17,510 Now, it's finally time to learn about segue, so that we can navigate between our screens in the storyboard. 3 4 00:00:17,790 --> 00:00:24,990 Now, when we created our SecondView Controller class entirely from scratch, it gave us a lot of control 4 5 00:00:25,140 --> 00:00:30,930 and allowed us to show you how we would inherit from UIViewController, 5 6 00:00:30,930 --> 00:00:37,610 How we could override the viewDidLoad method that came from the UIView Controller, as well as to happen 6 7 00:00:37,620 --> 00:00:41,210 to properties that come from the UIViewController as well. 7 8 00:00:42,090 --> 00:00:50,310 And we got to see the class, as well as the object created from the class in their purest forms. 8 9 00:00:50,610 --> 00:00:55,610 But you saw how much work it was just to create a single label. 9 10 00:00:55,620 --> 00:00:59,660 Now, imagine if we had to create the entire User Interface. 10 11 00:00:59,910 --> 00:01:09,000 It would require over 50 lines of code. But luckily for us, there's a much easier way of presenting another 11 12 00:01:09,000 --> 00:01:19,100 screen. So, let's go ahead and delete our SecondViewController file, and instead, we're going to go to 12 13 00:01:19,160 --> 00:01:28,730 File, New File. And this time, instead of choosing a Swift file, we're going to choose a Cocoa Touch Class. 13 14 00:01:28,730 --> 00:01:36,170 Now, Cocoa Touch refers to the framework that Apple has created that include UIKit and a whole bunch 14 15 00:01:36,170 --> 00:01:44,840 of other libraries that allows us to piggyback off their code, and make our lives a little bit easier. 15 16 00:01:44,960 --> 00:01:52,250 In this case, the class that we're going to create is gonna be called the ResultsViewController and 16 17 00:01:52,250 --> 00:01:57,410 it's going to be a SubClass of our UIViewController. 17 18 00:01:57,440 --> 00:01:59,450 Now, go ahead and click Next, 18 19 00:02:02,460 --> 00:02:10,830 and then make sure that it gets grouped with the Controllers, and then click Create. 19 20 00:02:10,950 --> 00:02:19,440 So now you should end up with a new file that already has UIKit imported that already has UIViewController 20 21 00:02:19,770 --> 00:02:27,210 as the SuperClass that we're inheriting from, and it should also have created the class code 21 22 00:02:27,210 --> 00:02:32,020 ResultViewController that's inside a file called ResultViewController.swift. 22 23 00:02:32,220 --> 00:02:39,180 It also got the viewDidLoad already implemented and all we have to do is to delete these comments 23 24 00:02:39,300 --> 00:02:50,690 and add our own custom code. Just as we have done before where we have our IBOutlets, IBActions, and we link 24 25 00:02:50,690 --> 00:02:52,540 our design with our code, 25 26 00:02:52,580 --> 00:02:59,960 I'm going to use this ResultViewController as the code file that's going to control and manage this 26 27 00:03:00,020 --> 00:03:01,100 screen. 27 28 00:03:01,370 --> 00:03:08,090 So we've already designed the screen for you. But in order to link it up with this new file, go ahead, 28 29 00:03:08,120 --> 00:03:12,170 and select it either with this little yellow button here, 29 30 00:03:12,260 --> 00:03:19,340 alternatively, in the document outline. And then, we're gonna pop open the right-hand pane and go to the 30 31 00:03:19,340 --> 00:03:22,430 identity inspector which is this one. 31 32 00:03:22,430 --> 00:03:29,750 Now, we're going to set the class that controls the screen and we're going to start typing results, and 32 33 00:03:29,750 --> 00:03:35,450 it should, hopefully, pick up on the name of our class here which is ResultViewController, so you can 33 34 00:03:35,450 --> 00:03:36,920 go ahead and hit enter 34 35 00:03:36,920 --> 00:03:43,710 once it finds that. You can also click on the dropdown list and try to scroll through this list to find 35 36 00:03:43,710 --> 00:03:44,400 it as well, 36 37 00:03:44,520 --> 00:03:54,510 but I find it easier just typing. So now that this is linked up, when we go into the Assistant View, we 37 38 00:03:54,510 --> 00:04:00,710 should be able to start linking up some IBOutlets, and some IBActions. 38 39 00:04:00,730 --> 00:04:07,060 Now, occasionally, Xcode doesn't quite pick up on this link as fast as it should do. 39 40 00:04:07,390 --> 00:04:14,110 So when you select each of these view controllers in the main.Storyboard, it should be automatically 40 41 00:04:14,110 --> 00:04:16,060 pulling up the linked file. 41 42 00:04:16,060 --> 00:04:22,150 So in this case, it's the ViewController.swift. But in this case, it's actually hasn't clocked on 42 43 00:04:22,150 --> 00:04:22,390 yet. 43 44 00:04:22,900 --> 00:04:28,920 So what we have to do is go to Automatic and select the ResultViewController. 44 45 00:04:29,530 --> 00:04:37,390 So in your case, you might not have this confusion, and X code is always changing, always trying to improve. 45 46 00:04:37,480 --> 00:04:42,390 It might be that you don't have this and you see this ResultViewController come up straight away 46 47 00:04:42,400 --> 00:04:46,420 when you go into assistant view. But at least on my copy at the moment, 47 48 00:04:46,450 --> 00:04:47,550 this is what I'm seeing. 48 49 00:04:47,920 --> 00:04:49,730 So this is how you can fix it. 49 50 00:04:51,180 --> 00:04:56,940 So now that we've got our code file and our design file side by side, let's go ahead and create some 50 51 00:04:56,970 --> 00:04:58,920 IBOutlets and IBActions. 51 52 00:04:59,010 --> 00:05:04,950 So the first one that I need a reference to is the place where I'm going to display the BMI value, so 52 53 00:05:04,950 --> 00:05:11,670 I'm going to create an Outlet here and I'll call that the bmiLabel, and then I'm going to create another 53 54 00:05:11,670 --> 00:05:19,480 Outlet from this label here which I'll just place below and I'll call that the adviceLabel. 54 55 00:05:19,600 --> 00:05:27,030 And finally, we're going to create a IBAction from our recalculate button right at the bottom 55 56 00:05:27,070 --> 00:05:28,570 after viewDidLoad. 56 57 00:05:28,570 --> 00:05:32,090 So this action is going to be of type UIButton, 57 58 00:05:32,470 --> 00:05:39,840 so that's the sender data type, and then the name is going to be recalculatePressed. 58 59 00:05:40,140 --> 00:05:40,950 So that's it. 59 60 00:05:40,980 --> 00:05:46,860 And we can go into our full screen of ResultViewController. 60 61 00:05:46,860 --> 00:05:54,780 And now we've got our two IBOutlets and an IBAction and we're able to use the design that we've created 61 62 00:05:54,870 --> 00:05:57,210 in our Interface Builder. 62 63 00:05:57,210 --> 00:06:03,750 Now, this might be a good time to also rename our ViewController.swift because it's probably better 63 64 00:06:03,780 --> 00:06:11,430 if the name tells us straight away which screen its managing in the Main.storyboard. So you can see 64 65 00:06:11,430 --> 00:06:18,060 that when you select this View Controller Scene and you go into the Identity Inspector, you can see that 65 66 00:06:18,060 --> 00:06:21,000 this is where that class is showing up. 66 67 00:06:21,000 --> 00:06:28,620 Now, you could manually go and change the file name, change the class name, and change the name of it in 67 68 00:06:28,710 --> 00:06:35,030 the Identity Inspector on the Main.storyboard as well, but that's quite a lot of work. 68 69 00:06:35,070 --> 00:06:41,910 A much easier way of doing this is simply to right-click on the name of the class, View Controller, go 69 70 00:06:41,910 --> 00:06:43,770 to refactor and rename, 70 71 00:06:46,520 --> 00:06:53,000 and now Xcode should be able to pick up on all the places where we're using that name View Controller, 71 72 00:06:53,120 --> 00:06:59,900 including the file name, the commenting, the class name, as well as in the Main..storyboard. 72 73 00:07:00,320 --> 00:07:07,760 So right here, we're going to change this to the CalculateViewController, and then go ahead and click 73 74 00:07:07,820 --> 00:07:14,370 rename for all of these places to be changed and updated. 74 75 00:07:14,450 --> 00:07:21,550 Now, occasionally, Xcode might trip up when you try to rename the name of the file and it doesn't actually 75 76 00:07:21,550 --> 00:07:22,930 change it over. 76 77 00:07:22,960 --> 00:07:30,190 So what you can do is you can go to Controller and Show in Finder, and inside that folder, make sure that 77 78 00:07:30,190 --> 00:07:37,660 the name of the file is CalculateViewController.swift. If not, you can simply just click and then 78 79 00:07:37,690 --> 00:07:40,510 pause one second, and then click again. 79 80 00:07:40,690 --> 00:07:44,630 If not, then you can simply just change its name here as well. 80 81 00:07:45,830 --> 00:07:47,860 And that should fix that problem. 81 82 00:07:48,470 --> 00:07:56,420 But otherwise, we've now got our two View Controllers each linked to a code file that inherits from 82 83 00:07:56,420 --> 00:07:57,580 UIViewController. 83 84 00:07:57,920 --> 00:08:06,440 And this ResultViewController is gonna be the second screen that we want to display onto our app. 84 85 00:08:06,490 --> 00:08:11,630 Previously, we had to initialize a View Controller manually using our code. 85 86 00:08:11,950 --> 00:08:19,280 If we go into Main.storyboard, there's actually a much easier way of navigating to the next screen. 86 87 00:08:19,480 --> 00:08:21,810 We can simply create a segue. 87 88 00:08:21,940 --> 00:08:28,060 So if you select the CalculateViewController, either in the document outline or this little yellow 88 89 00:08:28,360 --> 00:08:35,650 circle here in the Main.storyboard and you hold down your control key, then you can click and drag 89 90 00:08:35,710 --> 00:08:44,110 and point to the ResultViewController, and then let go. And now you're going to select a Segue and 90 91 00:08:44,110 --> 00:08:47,140 we're going to select Present modally. 91 92 00:08:47,230 --> 00:08:54,370 Now, the segue is, basically, going to initiate a transition to the next screen. 92 93 00:08:54,370 --> 00:09:01,450 It's going to display the transition in an animated way and you can choose your animation by simply 93 94 00:09:01,660 --> 00:09:08,950 selecting that little arrow that is representing the segue, and then change the Transition type, but 94 95 00:09:08,950 --> 00:09:15,880 we're going to keep everything as the default, and we're going to give this segue an identifier, so a 95 96 00:09:15,880 --> 00:09:19,290 way of being able to identify it through our code. 96 97 00:09:19,990 --> 00:09:23,910 And I'm going to call this goToResult. 97 98 00:09:24,670 --> 00:09:32,530 And now we have a segue which will transition to the next screen and we can trigger it by using that 98 99 00:09:32,530 --> 00:09:40,830 identifier goToResult. So now if we go ahead and copy this identifier, we don't make any typos in our 99 100 00:09:40,830 --> 00:09:44,860 code, and we go to our CalculateViewController.swift. 100 101 00:09:45,000 --> 00:09:50,520 Now, here we're going to delete this line where we create our secondViewController because that doesn't 101 102 00:09:50,520 --> 00:09:52,070 really exist anymore, 102 103 00:09:52,230 --> 00:09:58,480 and I'm also going to delete these two lines as well. Instead of all of that, 103 104 00:09:58,540 --> 00:10:05,120 what we're going to do is we're going to use a method that every UIViewController has, 104 105 00:10:05,320 --> 00:10:12,640 and we've managed to inherit it by inheriting from UIViewController. So we can tap into our current 105 106 00:10:12,760 --> 00:10:14,450 CalculateViewController. 106 107 00:10:14,890 --> 00:10:25,170 And from this view controller, we can trigger the method that's inherited code performSegue. 107 108 00:10:25,290 --> 00:10:26,910 So it's this one. 108 109 00:10:26,910 --> 00:10:32,470 And if we go ahead and hit enter, it should insert all of the parameters that we need to fill out. 109 110 00:10:32,490 --> 00:10:38,550 So in this case, in order to perform a segue, we have to put in the identifier and that's, of course, the 110 111 00:10:38,550 --> 00:10:45,030 identifier of the segue which you should have copied over, and you need to make sure that it's spelt 111 112 00:10:45,150 --> 00:10:54,530 exactly the same as what you had in the Main.storyboard right here. And then, we're going to specify 112 113 00:10:54,530 --> 00:10:55,270 the sender. 113 114 00:10:55,290 --> 00:10:59,120 So who is going to be the initiator of the segue? 114 115 00:10:59,120 --> 00:11:02,500 And it's, of course, our CalculateViewController, 115 116 00:11:02,570 --> 00:11:06,670 so that is, of course, our "self," our CalculateViewController, 116 117 00:11:06,680 --> 00:11:10,710 the current class. And now if we run our app, 117 118 00:11:16,040 --> 00:11:23,090 and we click on calculate, you should see that it navigates to the next screen which is our 118 119 00:11:23,090 --> 00:11:25,410 ResultViewController. 119 120 00:11:25,530 --> 00:11:32,630 So now it's just a matter of passing over the BMI value. Inside our ResultViewController, 120 121 00:11:32,760 --> 00:11:35,310 I'm going to create a new variable. 121 122 00:11:35,340 --> 00:11:42,660 So this is going to be a property of my ResultViewController and I'm going to call it bmiValue and 122 123 00:11:42,720 --> 00:11:49,080 I'm going to set it as a optional string because, initially, when I create my ResultViewController, 123 124 00:11:49,080 --> 00:11:51,000 I don't know what the BMI value is going to be. 124 125 00:11:51,480 --> 00:12:01,120 It's only when I've calculated the BMI, then can I actually pass it over. But now that the segue is responsible 125 126 00:12:01,420 --> 00:12:08,590 for initializing our ResultViewController and I no longer have to initialize it manually, 126 127 00:12:09,220 --> 00:12:17,080 well, how can we set the bmiValue property? If you take a look inside the ResultViewController, 127 128 00:12:17,150 --> 00:12:24,260 notice that when we created it, the template code also included a navigation section that's been commented 128 129 00:12:24,260 --> 00:12:24,960 out. 129 130 00:12:25,100 --> 00:12:30,230 You can see here it says that in a storyboard-based application, you'll often want to do a little preparation 130 131 00:12:30,230 --> 00:12:38,540 before navigation. And this is the method that you need to override in order to run some code just before 131 132 00:12:38,720 --> 00:12:40,250 the segue initiates, 132 133 00:12:40,400 --> 00:12:47,990 so in preparation for the segue. And in here, it has a comment that tells us if you want to get hold 133 134 00:12:48,110 --> 00:12:50,910 of a reference to the new view controller, 134 135 00:12:51,110 --> 00:12:59,860 well, you can simply use segue.destination. So you can either cut this and copy it over to our 135 136 00:12:59,880 --> 00:13:05,280 CalculateViewController or you can simply just write "prepare for," and find 136 137 00:13:05,300 --> 00:13:11,900 "prepare for segue method," and this is going to be a method that we inherit from you UIViewController 137 138 00:13:12,230 --> 00:13:14,480 which we're going to override. 138 139 00:13:14,480 --> 00:13:23,120 So inside here, we can tap into the sender.destination, and the sender.destination is going to 139 140 00:13:23,120 --> 00:13:33,470 be the view controller that will be initialized when the segue gets triggered. In a multiscreen app, 140 141 00:13:33,480 --> 00:13:39,360 it's more than possible that you could have multiple screens that all originate from one screen. 141 142 00:13:39,360 --> 00:13:48,330 So let's say that I was to find another view controller and I was to drag it onto the screen, and I also 142 143 00:13:48,330 --> 00:13:54,210 have a segue from my CalculateViewController to this other view controller. 143 144 00:13:54,630 --> 00:13:56,680 Well, now I've kind of got two segues, 144 145 00:13:56,700 --> 00:13:57,070 right? 145 146 00:13:57,090 --> 00:14:03,780 I've got one that goes here and one that goes here, and they both start from the CalculateViewController. 146 147 00:14:03,780 --> 00:14:10,770 And when either of those segues are performed, the prepare for segue method will get triggered. 147 148 00:14:10,770 --> 00:14:17,550 So to be able to differentiate between our segues or at least in a potential future where there 148 149 00:14:17,550 --> 00:14:26,010 might be a clash, we should first check to see if the segue.identifier is equal to the identifier 149 150 00:14:26,040 --> 00:14:30,900 that we assigned to the one that goes to the result screen. 150 151 00:14:31,110 --> 00:14:39,780 This one. So let's check to see if segue.identifier is equal to "goToResult, spelled the exactly the same 151 152 00:14:39,780 --> 00:14:40,540 way again. 152 153 00:14:40,650 --> 00:14:42,510 And then, in that case, 153 154 00:14:42,510 --> 00:14:48,110 well, we know that we've narrowed down on the actual correct segue. 154 155 00:14:48,210 --> 00:14:56,880 So now what we can do is we can create a reference to that new view controller that's going to be initialized 155 156 00:14:57,210 --> 00:14:59,900 when the segue gets performed. 156 157 00:15:00,120 --> 00:15:03,040 So let's create a constant code destinationVC 157 158 00:15:03,220 --> 00:15:08,030 and we're gonna set it to equal segue.destination. 158 159 00:15:08,220 --> 00:15:15,480 Now, this destination is the view controller that will be initialized when the segue gets performed, 159 160 00:15:15,480 --> 00:15:19,110 and it has a type of UIViewController. 160 161 00:15:19,110 --> 00:15:27,900 So even though we know that for a fact when the goToResult Segue gets triggered, then it's definitely 161 162 00:15:27,900 --> 00:15:37,140 going to be this one which will initialize a ResultViewController. But if we tried to say 162 163 00:15:37,140 --> 00:15:46,860 destinationVC.bmiValue, well, we're going to get an error because it says, 'UIViewControllers' don't have 163 164 00:15:46,920 --> 00:15:50,850 'bmiValue' and, indeed, that is true. 164 165 00:15:50,850 --> 00:15:58,140 So why is it not picking up on this property that we have in our ResultViewController? 165 166 00:15:58,140 --> 00:16:05,610 Well, it's because that the segue.destination has a data type of UIViewController and, therefore, 166 167 00:16:05,700 --> 00:16:09,980 our destinationVC is also a UIViewController, 167 168 00:16:10,500 --> 00:16:14,820 but the bmiValue only exists within our ResultViewController. 168 169 00:16:15,420 --> 00:16:22,620 So in order to narrow it down to say that the segwue destination is actually a ResultViewController. 169 170 00:16:23,070 --> 00:16:32,660 We can say "as!" ResultsViewController. And as soon as we do that, then it recognizes 170 171 00:16:32,660 --> 00:16:39,950 the bmiValue, and our destinationVC turns into a ResultViewController data type. 171 172 00:16:39,950 --> 00:16:49,310 So now we can set this bmiValue to "0.0" and all of our code is now error-free. 172 173 00:16:49,320 --> 00:16:58,380 Now, why is it that we had to do this? And what does it mean when we write "as"? Well, remember that we're 173 174 00:16:58,560 --> 00:17:06,510 overriding this "prepare for segue" method, and that when Apple created this method, they didn't know that 174 175 00:17:06,510 --> 00:17:12,810 we were going to create a ResultViewController. We didn't know about a bmiValue that we needed to 175 176 00:17:12,810 --> 00:17:13,610 set. 176 177 00:17:13,620 --> 00:17:21,140 So what they've done is that the segue will initialize a box standard UIViewController. 177 178 00:17:21,180 --> 00:17:29,310 Now, it's our job to narrow down the data type and specify the exact data type that the destination will 178 179 00:17:29,310 --> 00:17:30,230 be. 179 180 00:17:30,240 --> 00:17:39,250 So by using this "as" keyword, we are effectively performing something called downcasting. At the moment, 180 181 00:17:39,300 --> 00:17:45,180 we have a UIViewController which, of course, is the SuperClass of our ResultViewController, 181 182 00:17:45,180 --> 00:17:54,240 we can cast it down to a ResultViewController by writing the keyword "as." Now, the exclamation mark here 182 183 00:17:54,270 --> 00:17:57,550 says this is going to be a forced downcast, 183 184 00:17:57,840 --> 00:18:05,460 so just as when we use the exclamation mark to unwrap optionals, this expresses our certainty that when 184 185 00:18:05,460 --> 00:18:12,150 the segue is identified its goToResult, then the destination view controller that gets created is 185 186 00:18:12,150 --> 00:18:20,370 definitely going to be a ResultViewController. So now can you use what you've learned and what you 186 187 00:18:20,370 --> 00:18:29,220 know to try and get the bmiValue that we calculated inside calculatePressed over into our 187 188 00:18:29,220 --> 00:18:37,020 prepare for segue, so that we can actually set the destinationVC.bmiValue to the actual calculated value, 188 189 00:18:37,320 --> 00:18:44,230 rather than just "0.0"? There's a few bits of code that you'll need to change, but the end result 189 190 00:18:44,320 --> 00:18:49,930 if you're successful is you should be able to change the height and weight toggles, click on calculate, 190 191 00:18:50,290 --> 00:18:58,090 and you should end up with the actual BMI result being passed over and displayed in this BMI label. Pause 191 192 00:18:58,090 --> 00:19:00,400 the video and see if you can complete this challenge. 192 193 00:19:04,750 --> 00:19:05,110 All right. 193 194 00:19:05,140 --> 00:19:11,650 So at the moment, we know that we've got our BMI being calculated in the calculatePressed IBAction, 194 195 00:19:11,950 --> 00:19:16,500 but we actually need that value in our "prepare for segue" method. 195 196 00:19:16,540 --> 00:19:18,340 So how do we move it over? 196 197 00:19:18,340 --> 00:19:25,000 Well, one of the easiest ways is to simply create a variable in our CalculateViewController, so we can 197 198 00:19:25,000 --> 00:19:32,560 call it bmiValue and we can set it to start off being equal to "0.0." And then when we calculate 198 199 00:19:32,590 --> 00:19:41,920 our BMI, we can format it so that we only get it to one decimal place. So we could say bmiValue is equal 199 200 00:19:41,920 --> 00:19:49,030 to a String that is formatted with this particular format. 200 201 00:19:49,030 --> 00:19:49,680 So it's gonna be 201 202 00:19:49,690 --> 00:19:56,830 "%.1f" and then the value that we want to format is of course that bmi floating point number 202 203 00:19:56,890 --> 00:19:58,360 that we got here. 203 204 00:19:58,360 --> 00:20:06,640 And so now we've got our bmiValue stored at the top level and we can place it in here as the value 204 205 00:20:06,640 --> 00:20:08,440 that we'll pass over. 205 206 00:20:08,440 --> 00:20:15,370 So now when our segue gets triggered, we'll pass over the bmiValue to our destinationVC which is 206 207 00:20:15,370 --> 00:20:19,130 our ResultViewController and it should land in here. 207 208 00:20:19,150 --> 00:20:27,550 Now, when this view loads up, we can set the bmiLabel's text property to equal the bmiValue. 208 209 00:20:27,550 --> 00:20:28,930 Now, if we hit run, 209 210 00:20:32,040 --> 00:20:34,220 you'll see that our calculated 210 211 00:20:34,230 --> 00:20:43,130 BMI gets passed over and displayed in our result view controller. So now that you've seen how we can 211 212 00:20:43,130 --> 00:20:49,290 use these segues to move forwards going from one screen to the next, 212 213 00:20:49,370 --> 00:20:50,750 how do we go backwards? 213 214 00:20:50,750 --> 00:20:55,740 How can we dismiss this screen and show the one previous? 214 215 00:20:55,760 --> 00:21:03,050 So I'm going to delete this view controller because we're only working with these two. And you might 215 216 00:21:03,050 --> 00:21:09,500 think that the solution is to create a segue wheel this way back, but actually there's a much easier 216 217 00:21:09,500 --> 00:21:10,110 way. 217 218 00:21:10,370 --> 00:21:16,370 If you go into your ResultViewController, the time point where we actually want to remove this 218 219 00:21:16,370 --> 00:21:22,460 ResultViewController from the app, and instead show the previous screen which is our CalculateViewController 219 220 00:21:22,880 --> 00:21:26,040 is when the user presses the recalculate button. 220 221 00:21:26,210 --> 00:21:33,920 So inside this IBAction, we can simply tap into a method that, again, comes from our UIViewController 221 222 00:21:34,520 --> 00:21:40,030 and we can call it by simply writing self.dismiss. 222 223 00:21:40,530 --> 00:21:47,660 And this will dismiss the current view controller which is, of course, our result view controller. 223 224 00:21:48,500 --> 00:21:54,710 So if we go ahead and insert that code, we can set the animated property to true, so that the transition 224 225 00:21:54,710 --> 00:22:01,610 happens in an animated way, and we can set the completion to nil, so that nothing happens after we dismiss 225 226 00:22:01,610 --> 00:22:05,540 it, we just go back to the previous screen. And if we now run our app, 226 227 00:22:08,320 --> 00:22:15,040 you can see that we're able to go forwards by clicking on the calculate button which triggers the segue 227 228 00:22:15,640 --> 00:22:21,750 and go backwards by clicking on the recalculate button which dismisses that second screen, 228 229 00:22:21,760 --> 00:22:23,740 the ResultViewController. 229 230 00:22:23,740 --> 00:22:30,760 Now, here's something I want to show you. when we create apps that have multiple screens, what essentially 230 231 00:22:30,760 --> 00:22:37,960 happens is that the newer screens gets laid on top of the previous screens, like a stack of pancakes. 231 232 00:22:39,890 --> 00:22:46,580 And if you want to see them in 3D, then you can simply make sure that your app is running, and then click 232 233 00:22:46,670 --> 00:22:48,320 on this particular icon, 233 234 00:22:51,900 --> 00:22:55,640 and it will show you what's currently displayed in the app. 234 235 00:22:55,740 --> 00:23:00,250 But if you click and move, you can see it in 3D. 235 236 00:23:00,270 --> 00:23:07,400 You can see that our ResultViewController is simply overlaid on top of the CalculateViewController. 236 237 00:23:07,410 --> 00:23:12,740 So once we dismiss this view controller, then we go back to our previous screen. 237 238 00:23:12,870 --> 00:23:17,130 You can also see where our labels lie on top. 238 239 00:23:17,130 --> 00:23:23,580 And relative to other User Interface Elements, there's a really handy way of debugging what's going on 239 240 00:23:23,640 --> 00:23:32,570 with our UI. So that's just a neat trick. Now that we've figured out how to go forwards by creating a 240 241 00:23:32,570 --> 00:23:39,620 segue in the storyboard, and then triggering it by calling performSegue which comes from our SuperClass 241 242 00:23:39,650 --> 00:23:47,330 that we're inheriting the UIViewController, and then we're able to prepare for that segue by setting 242 243 00:23:47,330 --> 00:23:50,180 some properties in the destination of the segue. 243 244 00:23:50,810 --> 00:23:58,970 And finally, were able to dismiss the presented view controller by calling the dismiss method which, again, 244 245 00:23:59,000 --> 00:24:04,690 we have access to because it comes from the UIViewController which we're inheriting from. 245 246 00:24:04,700 --> 00:24:11,120 Now, of course, Swift is smart enough to know that we're using the dismiss method from this current class. 246 247 00:24:11,480 --> 00:24:18,970 So in fact, the "self" keyword is not necessary. In some cases, especially when we're creating initializers, 247 248 00:24:19,130 --> 00:24:24,470 it's quite helpful to use the "self" keyword to make it easier to understand what's going on. 248 249 00:24:24,500 --> 00:24:29,480 So it's up to you whether if you want to keep it or if you want to simply delete it and keep your code 249 250 00:24:29,480 --> 00:24:36,200 clean. But that's how we can create segues and how we can go backwards and forwards and navigate 250 251 00:24:36,200 --> 00:24:38,430 through our multiscreen app. 251 252 00:24:38,750 --> 00:24:44,840 Now, in the next lesson, we're going to continue building out our app, and we're going to modify more of 252 253 00:24:44,840 --> 00:24:50,390 our ResultViewController by changing the background color depending on the BMI, changing the advice, 253 254 00:24:50,810 --> 00:24:54,950 and making our app conform to the MVC design pattern. 254 255 00:24:55,010 --> 00:24:58,070 So for all of that and more, I'll see you on the next lesson.