1
00:00:07,610 --> 00:00:12,330
It everybody what's going on this is Calleigh began with Debb slopes dot com and we're going to continue

2
00:00:12,330 --> 00:00:17,910
building out our app for using protocols to delegate the passing of information between two controllers

3
00:00:17,920 --> 00:00:20,670
so let's pull open our project again.

4
00:00:20,670 --> 00:00:26,880
And in this video we're going to go ahead and do the code related stuff in the last video we basically

5
00:00:26,880 --> 00:00:30,980
just built out the UI and kind of hooked everything up the way that it needs to be.

6
00:00:31,110 --> 00:00:34,520
But now we're going to get into the good stuff the code.

7
00:00:34,620 --> 00:00:38,400
So let's begin actually by creating our protocol.

8
00:00:38,700 --> 00:00:41,460
Remember a protocol is like a blueprint.

9
00:00:41,490 --> 00:00:46,910
It's like a set of instructions or requirements needed to achieve a certain kind of functionality.

10
00:00:46,920 --> 00:00:52,830
So to begin we're going to go ahead and right click on color magic click new file and we're going to

11
00:00:52,830 --> 00:00:54,750
create a new Swift file.

12
00:00:54,980 --> 00:00:55,580
OK.

13
00:00:55,920 --> 00:01:03,750
Now for this kind of protocol where we are dealing with specific functionality in an application we're

14
00:01:03,750 --> 00:01:06,040
going to actually call it a delegate.

15
00:01:06,090 --> 00:01:12,770
Not a protocol because the protocol itself is acting as a delegate between the two of you controllers.

16
00:01:12,770 --> 00:01:13,150
OK.

17
00:01:13,230 --> 00:01:19,050
It's delegating those tasks so we're going to go ahead and call this color transfer because that's that's

18
00:01:19,050 --> 00:01:19,650
its job.

19
00:01:19,650 --> 00:01:20,840
That's what it's doing.

20
00:01:21,060 --> 00:01:24,590
And it is the color transfer delegate.

21
00:01:24,750 --> 00:01:32,400
That's what we're going to name and color transfer delegate click Create and we now have a color transfer

22
00:01:32,400 --> 00:01:34,320
delegate swift file.

23
00:01:34,320 --> 00:01:40,170
Now of course we're going to need to actually create the protocol right here by typing protocol just

24
00:01:40,170 --> 00:01:41,780
like we did in the previous videos.

25
00:01:42,120 --> 00:01:46,800
And its name is color transfer delegate.

26
00:01:47,640 --> 00:01:48,880
Very easy.

27
00:01:49,020 --> 00:01:55,750
Now we need to think we need to set up a function that's going to do two things.

28
00:01:55,770 --> 00:02:04,000
This function is going to basically pass a color from the button to the view in the first view controller.

29
00:02:04,290 --> 00:02:09,720
And it's also going to pass a label it's going to past the name of the color on the button.

30
00:02:09,900 --> 00:02:16,140
So we need a function that can accept two parameters one of color and one of string.

31
00:02:16,170 --> 00:02:24,870
So we're going to go ahead and just write the function here for our protocol called phunk user did choose.

32
00:02:25,110 --> 00:02:34,230
And we're going to say the user did choose a color of type color and that color is going to be with

33
00:02:34,440 --> 00:02:41,490
a name and we'll we'll use an internal parameter here called Color name of type string and you'll see

34
00:02:41,490 --> 00:02:44,230
why I'm using this internal parameter later.

35
00:02:44,340 --> 00:02:46,350
But it's giving us an issue.

36
00:02:46,410 --> 00:02:49,580
It says use of undeclared type color.

37
00:02:49,710 --> 00:02:54,560
The reason for that we're only importing foundation color is a part of it.

38
00:02:54,570 --> 00:02:59,060
So beneath Foundation go had an import kit so we can have both.

39
00:02:59,250 --> 00:03:01,940
And you'll notice our air will go away.

40
00:03:01,950 --> 00:03:08,930
So here is our color transfer delegate and I'm going to explain how this is used in just a little bit.

41
00:03:09,000 --> 00:03:09,990
OK.

42
00:03:10,170 --> 00:03:16,070
So we need to think about what we are doing here when we go into our main storyboard.

43
00:03:16,260 --> 00:03:22,770
We are tapping our plus button and it's loading up our view controller here with all of our options

44
00:03:23,370 --> 00:03:26,640
in our color picker Visi when we choose a button.

45
00:03:26,790 --> 00:03:32,270
It gives us the ability to pull out the title label as well as the background color.

46
00:03:32,310 --> 00:03:33,600
So here's what we need to do.

47
00:03:33,600 --> 00:03:40,880
We need to basically set up a variable in color picker Visi for our delegate.

48
00:03:40,890 --> 00:03:42,720
Okay our color transfer delegate.

49
00:03:42,720 --> 00:03:46,290
So I'm going to create a variable for that and I'll explain this in just a moment.

50
00:03:46,470 --> 00:03:53,850
But we're going to go ahead and type of var delegate loops delegate and that's going to be of type color

51
00:03:53,940 --> 00:03:55,580
transfer delegate.

52
00:03:55,620 --> 00:04:00,710
Now the thing is this delegate it says we don't have any initializers.

53
00:04:00,720 --> 00:04:03,920
And so what we need to do is we need to initialize it from the get go.

54
00:04:04,140 --> 00:04:07,720
But at the beginning we're not going to actually have a delegate.

55
00:04:07,740 --> 00:04:10,610
It's going to be equal to nil from the beginning.

56
00:04:10,650 --> 00:04:13,080
So the delegate is going to be equal to nil.

57
00:04:13,130 --> 00:04:20,850
Now basically why we are creating a delegate here is because when we tap on a button we're going to

58
00:04:20,850 --> 00:04:29,450
be able to use this function delegate dot user delegate dot

59
00:04:32,000 --> 00:04:35,730
delegate it is delegate user did choose color.

60
00:04:35,950 --> 00:04:40,130
And we can pass in a UI color and we can pass in a name.

61
00:04:40,210 --> 00:04:46,470
Now we can't because the delegate is nil from the beginning and that's where we're going to fix that

62
00:04:46,930 --> 00:04:49,120
and we're going to fix this right now.

63
00:04:49,360 --> 00:04:53,920
So we have a delegate property color picker Visi has a delegate property.

64
00:04:54,100 --> 00:05:00,700
And what we need to do is we need to instantiate that property when we tap on the plus button to open

65
00:05:00,700 --> 00:05:09,160
up our view controller so to do that we're going to use a function called prepare for Segway just like

66
00:05:09,160 --> 00:05:10,160
that.

67
00:05:10,330 --> 00:05:17,290
Now preparing for a Segway basically means when I press the plus button I need to tell it what it should

68
00:05:17,290 --> 00:05:19,990
do in order to present the next view controller.

69
00:05:19,990 --> 00:05:25,330
Now if I click on the Segway here that's that arrow represents the Segway.

70
00:05:25,560 --> 00:05:30,310
And if I go into the attributes inspector you can see there is some information for this Segway.

71
00:05:30,310 --> 00:05:34,110
The most important thing we need to think about right now is the identifier.

72
00:05:34,330 --> 00:05:39,520
And that is what's going to set this Segway apart from all other segues So let's just go ahead and let's

73
00:05:39,520 --> 00:05:45,990
name this present color picker Visi press enter.

74
00:05:46,090 --> 00:05:52,330
And now this Segway has a specific identifier so we can get that exact Segway and do something with

75
00:05:52,330 --> 00:05:53,050
it.

76
00:05:53,110 --> 00:05:56,920
So go back to color presenter Visi and prepare for Segway.

77
00:05:56,920 --> 00:05:59,550
This is where we're going to actually present our color visi.

78
00:05:59,560 --> 00:06:02,480
We're going to do this programmatically but for good reason.

79
00:06:02,500 --> 00:06:03,650
Let me show you why.

80
00:06:03,730 --> 00:06:13,420
So go ahead and let's just say if Segway meaning if one of the segues and our storyboard identifier

81
00:06:13,600 --> 00:06:23,230
is equal to present color picker Visi that's our identifier.

82
00:06:23,230 --> 00:06:28,420
If it's equal to that we're going to present our color picker Visi so to do that let's go ahead and

83
00:06:28,420 --> 00:06:33,450
let's create a constant that's going to be of type color picker visi.

84
00:06:33,820 --> 00:06:37,960
And then after that we're going to do something with the protocol that that explains why we created

85
00:06:37,960 --> 00:06:41,070
that delegate variable on color picker B.C..

86
00:06:41,170 --> 00:06:50,980
So go ahead and type guard let color picker Visi and we're going to say that this is equal to the Segway

87
00:06:51,540 --> 00:06:52,990
destination.

88
00:06:53,140 --> 00:06:59,290
And do you notice that it says it's of type you view controller that is because every Segway has a destination

89
00:06:59,290 --> 00:06:59,910
View Controller.

90
00:06:59,920 --> 00:07:03,850
And we're going to actually set it to be equal to color picker visi.

91
00:07:03,940 --> 00:07:10,150
But if we want it to be of type color picker Visi we actually need to force cast this as color picker

92
00:07:10,150 --> 00:07:12,920
Visi like so.

93
00:07:13,300 --> 00:07:18,170
But since we're using guard lead we need to provide an instance in case this doesn't work.

94
00:07:18,190 --> 00:07:20,100
So we're going to type else.

95
00:07:20,410 --> 00:07:24,580
And if we don't get a color picker Visi we're just going to return and break out of this function so

96
00:07:24,580 --> 00:07:26,260
we don't cause a crash.

97
00:07:26,260 --> 00:07:31,670
So Garlett is basically a safe way to create a constant that is non-optional.

98
00:07:31,930 --> 00:07:36,460
And if it is nil if it does return nil we're just going to go ahead and return out of the function so

99
00:07:36,460 --> 00:07:37,300
we don't have a crash.

100
00:07:37,300 --> 00:07:38,630
Pretty cool.

101
00:07:38,650 --> 00:07:44,250
So we now have a color picker Visi and this is where the coolest part happens.

102
00:07:44,260 --> 00:07:50,760
So like we have said our color picker Visi needs a delegate but it's currently nil.

103
00:07:50,920 --> 00:07:51,440
OK.

104
00:07:51,550 --> 00:07:57,370
Now the delegate is basically going to be used to pass information from one view controller to the next.

105
00:07:57,370 --> 00:08:03,190
So in our color presenter VC what we're going to do is we're going to go ahead and say color picker

106
00:08:03,270 --> 00:08:11,680
Visi delegate OK remember it has that property although it's not letting us access it.

107
00:08:11,680 --> 00:08:13,050
Let's try that again.

108
00:08:13,210 --> 00:08:17,220
Color picker Visi dot delegate.

109
00:08:17,260 --> 00:08:17,860
We're getting an error.

110
00:08:17,860 --> 00:08:19,540
Let's try to build and see what the error is

111
00:08:22,580 --> 00:08:24,260
initialiser for conditional binding.

112
00:08:24,830 --> 00:08:29,440
Since we're in a guard let We need to go ahead and bind that conditionally.

113
00:08:29,480 --> 00:08:31,090
That is our problem.

114
00:08:31,190 --> 00:08:37,820
And now there we go now that we have a color picker we can go ahead and type dot delegate.

115
00:08:37,820 --> 00:08:40,040
That's a property of color picker visi.

116
00:08:40,280 --> 00:08:44,060
And we need to set it to be equal to something right.

117
00:08:44,090 --> 00:08:48,470
We need to basically pin the delegate to a certain view controller saying where are we going to delegate

118
00:08:48,470 --> 00:08:51,140
this information from the previous view controller.

119
00:08:51,140 --> 00:08:57,320
Now if I were to go in and if I was going to set this view controller color presenter AVC to be equal

120
00:08:57,560 --> 00:08:58,790
to the delegate.

121
00:08:58,790 --> 00:09:05,560
Watch what happens when I build and run this can not assign whips can not assign value of type color

122
00:09:05,560 --> 00:09:08,520
presenter AVC to type color transfer delegate.

123
00:09:08,650 --> 00:09:15,340
Do you know why we have not conformed to our color transfer delegate protocol so to do that.

124
00:09:15,340 --> 00:09:20,970
Go ahead and type a comma type color transfer delegate and now we have conformed.

125
00:09:20,980 --> 00:09:22,470
But watch what happens.

126
00:09:22,510 --> 00:09:29,050
We're going to get an error and it says we do not conform to protocol color transfer delegate.

127
00:09:29,050 --> 00:09:30,150
Why is that.

128
00:09:30,310 --> 00:09:33,690
If I go Look you can see there is a required function.

129
00:09:33,700 --> 00:09:40,060
So we need to basically call that function in whatever view controller we are conforming to that delegate

130
00:09:40,060 --> 00:09:40,700
for.

131
00:09:40,780 --> 00:09:47,440
So get rid of the boilerplate code there and beneath feuded load we need to type user did choose color

132
00:09:47,920 --> 00:09:50,930
from our color transfer delegate.

133
00:09:51,010 --> 00:09:52,530
That's really cool.

134
00:09:52,540 --> 00:09:54,520
Now think about this.

135
00:09:54,730 --> 00:09:59,240
This function is going to be called from the other view controller.

136
00:09:59,700 --> 00:10:00,560
OK.

137
00:10:00,610 --> 00:10:02,100
Let that sink in for a second.

138
00:10:02,410 --> 00:10:07,860
I am loading the color transfer Visi Let me show you on the simulator here really quick.

139
00:10:08,080 --> 00:10:14,380
When I open this up and I click on this what I'm doing is I'm setting the previous view controller to

140
00:10:14,380 --> 00:10:15,760
be the delegate.

141
00:10:15,760 --> 00:10:25,360
And that means that if I am in color picker Visi Now if I press a button I can basically use my delegate

142
00:10:25,390 --> 00:10:33,430
which is now not nil and I can call delegate Dom user did choose color so I can call like this delegate

143
00:10:33,670 --> 00:10:38,390
user did choose you eye color and I could pass.

144
00:10:38,500 --> 00:10:42,790
Well let's think the sender is the button and I could send the background color.

145
00:10:42,850 --> 00:10:45,790
OK there's a color and the name.

146
00:10:45,790 --> 00:10:47,190
I already printed it out.

147
00:10:47,280 --> 00:10:49,500
Sender title label dot text.

148
00:10:49,660 --> 00:10:53,210
So I could cut that and paste it here.

149
00:10:53,350 --> 00:10:57,320
Now that I have a delegate I should be able to send that information back.

150
00:10:57,460 --> 00:11:03,250
So if the delegate is equal to color presenter AVC It's like I'm calling that function.

151
00:11:03,250 --> 00:11:09,700
On the other controller but we need to think what is user did choose color with name going to do in

152
00:11:09,700 --> 00:11:16,380
this view controller uncolored presenter Visi this function right here a user did choose.

153
00:11:16,630 --> 00:11:22,240
It should change the background color of this view and it should change this text in this label to be

154
00:11:22,240 --> 00:11:23,860
the colors name.

155
00:11:23,860 --> 00:11:28,330
So go ahead and we're going to say self view.

156
00:11:28,360 --> 00:11:30,080
Well you know what I don't even need to call self.

157
00:11:30,090 --> 00:11:41,440
I can just say View background color equals color and I can say color name label color and name label

158
00:11:41,440 --> 00:11:44,560
dot text is equal to color name.

159
00:11:44,830 --> 00:11:49,150
And that's why I use that internal parameter there because using with name as the parameter doesn't

160
00:11:49,150 --> 00:11:51,300
really make sense but color name does.

161
00:11:51,590 --> 00:11:57,790
So when this function gets called uncolored picker Visi and I pass in the buttons background color and

162
00:11:57,790 --> 00:11:59,560
the buttons title label.

163
00:11:59,800 --> 00:12:02,140
It's going to go ahead and send that through to this function.

164
00:12:02,170 --> 00:12:08,740
Set the view of color presenter AVC to be whatever color the button was and it will set the labels text

165
00:12:08,740 --> 00:12:12,850
property to be equal to whatever the buttons title label was.

166
00:12:12,850 --> 00:12:16,890
Now I am getting some errors here and it's saying that we do not conform to the protocol.

167
00:12:16,900 --> 00:12:19,750
Now if I build and run you'll see that error goes away.

168
00:12:19,930 --> 00:12:25,000
OK sometimes you need to do that but we are getting an issue here and it's saying that background color

169
00:12:25,000 --> 00:12:26,050
is not unwrapped.

170
00:12:26,110 --> 00:12:30,910
We need to do that because those properties do come in as optional because you don't have to set a background

171
00:12:30,910 --> 00:12:35,880
color as well as our title label here.

172
00:12:35,890 --> 00:12:36,400
But you know what.

173
00:12:36,400 --> 00:12:38,520
Since I know for sure that I have a value.

174
00:12:38,590 --> 00:12:43,310
I'm going to go ahead and force on RAP the title label because each button has one for sure.

175
00:12:43,540 --> 00:12:45,180
You wouldn't normally do that.

176
00:12:45,220 --> 00:12:50,280
You might want to actually cast this in some type of guard but instead of using guard let.

177
00:12:50,320 --> 00:12:54,050
I'm just going to go ahead and force unwrap the title label property.

178
00:12:54,160 --> 00:12:57,510
But now let's go ahead and let's just think about what we're doing here.

179
00:12:57,520 --> 00:13:03,470
We are able to go in we can select this button and we set the delegate to have a value.

180
00:13:03,490 --> 00:13:03,730
Right.

181
00:13:03,730 --> 00:13:07,900
We set color transfer delegate to be equal to the previous view controller.

182
00:13:07,960 --> 00:13:14,440
Then once it has a value when we select a button we should be able to pass that value back to the view

183
00:13:14,440 --> 00:13:15,260
controller.

184
00:13:15,440 --> 00:13:21,580
OK delegate user to choose we pass the color back but it's not going to do us much good if we stay on

185
00:13:21,580 --> 00:13:23,340
this view controller right.

186
00:13:23,440 --> 00:13:24,870
That's going to be a problem.

187
00:13:24,880 --> 00:13:30,970
So what we can do is in order to actually get back to the previous view controller we can call self

188
00:13:31,540 --> 00:13:37,720
navigation control or remember we embedded in a navigation controller so that's automatically a property

189
00:13:38,260 --> 00:13:44,080
and all we need to do is type pop view controller and that's going to pop us back one view controller

190
00:13:44,710 --> 00:13:46,870
of course we want that to be animated.

191
00:13:47,290 --> 00:13:51,980
And now when I select the color button it should pass the value it should.

192
00:13:52,030 --> 00:13:57,050
Sorry it should pass the value for the color for the title label and it should pop the color of your

193
00:13:57,040 --> 00:13:59,800
controller back to the direction it came.

194
00:13:59,950 --> 00:14:04,500
And when we go back to presenter AVC this function is called.

195
00:14:04,540 --> 00:14:10,160
So we're going to set the background color and the color name label to have a value.

196
00:14:10,270 --> 00:14:11,420
You want to go try it out.

197
00:14:11,710 --> 00:14:12,380
I do.

198
00:14:12,670 --> 00:14:13,440
Let's build and run.

199
00:14:13,440 --> 00:14:18,550
Let's go see how we did and why we should be able to call this video Arap.

200
00:14:18,550 --> 00:14:19,380
So check it out.

201
00:14:19,390 --> 00:14:21,840
If I select here it opens it up.

202
00:14:21,850 --> 00:14:23,560
We don't get a crash that's good.

203
00:14:23,560 --> 00:14:28,480
And now when I select a button it should set the view and the label to match.

204
00:14:28,480 --> 00:14:30,020
Check it out.

205
00:14:30,130 --> 00:14:36,000
It works blue green red purple.

206
00:14:36,070 --> 00:14:37,870
So so cool.

207
00:14:37,870 --> 00:14:45,040
So this is just one amazing way that we can basically use a delegate to transfer information and communicate

208
00:14:45,040 --> 00:14:46,680
between two view controllers.

209
00:14:46,720 --> 00:14:48,590
Super super cool.

210
00:14:48,610 --> 00:14:52,170
Now of course there's one thing we should do this delegate is optional.

211
00:14:52,180 --> 00:14:57,850
So what if for some reason the delegate was not able to be passed in we would get a crash.

212
00:14:57,850 --> 00:15:03,340
So we should go ahead and type if delegate is not equal to nil.

213
00:15:03,370 --> 00:15:07,890
There should be an equal sign if the delegate is not nil.

214
00:15:08,110 --> 00:15:10,330
Then we should call a user to choose.

215
00:15:10,420 --> 00:15:12,230
And we should pop the view controller back.

216
00:15:12,370 --> 00:15:12,890
OK.

217
00:15:13,120 --> 00:15:17,550
That's just the way to be safe and to make sure that we are not going to have a crash.

218
00:15:17,560 --> 00:15:22,210
Now of course that's not going to do anything right now because our delegate is non nil.

219
00:15:22,210 --> 00:15:24,950
We pass it in when we create the view controller.

220
00:15:25,000 --> 00:15:26,320
But check it out guys.

221
00:15:26,320 --> 00:15:31,330
This works we're able to pass colors and all kinds of other cool values if we wanted to.

222
00:15:31,360 --> 00:15:32,710
This is super super awesome.

223
00:15:32,710 --> 00:15:38,940
So great job using your first protocol to use the delegate method for transferring data between two

224
00:15:38,990 --> 00:15:40,120
view controllers.

225
00:15:40,150 --> 00:15:41,940
Awesome work in the next video.

226
00:15:42,250 --> 00:15:47,620
I'm going to show you how we can use what are called mutating functions to toggle on and toggle off

227
00:15:47,620 --> 00:15:48,560
certain switches.

228
00:15:48,560 --> 00:15:52,900
It's just one particular use case but it's pretty useful and you could use it in a lot of different

229
00:15:52,900 --> 00:15:54,760
ways so I'll see in the next video.

230
00:15:54,760 --> 00:15:56,240
Awesome job with this one.