1
00:00:00,390 --> 00:00:04,600
Hi again in our last lesson we saw how we could use a date picture of you.

2
00:00:04,640 --> 00:00:09,780
And in this assembly we're going to see Hollywood expand on that and use a picture of you to pick almost

3
00:00:09,810 --> 00:00:16,440
anything a number out of a set of numbers and name other set of names or even an image out of a set

4
00:00:16,440 --> 00:00:17,550
of images.

5
00:00:17,550 --> 00:00:21,860
Now pick your views even though they are not the most useful outlet out there.

6
00:00:21,860 --> 00:00:26,990
They're actually very fundamental to our learning process because a lot of this stuff that we learn

7
00:00:27,000 --> 00:00:30,450
in here are comparable to those that we use in UI.

8
00:00:30,450 --> 00:00:35,400
Table views as well as UI collection views and they're actually very different than the things we have

9
00:00:35,400 --> 00:00:36,680
done so far.

10
00:00:36,690 --> 00:00:42,270
So to me the sanctuary one of our more important lessons even though it is actually simple.

11
00:00:42,270 --> 00:00:45,620
So let's go ahead and tweak scored and see how you're going to do all of these.

12
00:00:45,630 --> 00:00:55,200
And when I go in here and say I have a picture view app and I'm able to my storyboard and add a picture

13
00:00:55,200 --> 00:01:02,100
of you I'm going to go in here and say Give me a picture of you and the picture view is is essentially

14
00:01:02,100 --> 00:01:07,560
a way for you to go through the event items by scrolling and choose one of them.

15
00:01:07,880 --> 00:01:12,030
And I'm gonna get started with a very simple one and then one step at a time I'm going to make it more

16
00:01:12,030 --> 00:01:12,870
complicated.

17
00:01:13,200 --> 00:01:19,680
So let's add all of our constraints add missing constraint and then go to our assistant window and in

18
00:01:19,680 --> 00:01:24,830
here I'm only going to add one thing in here and that is that picture view itself.

19
00:01:24,870 --> 00:01:29,900
I'm going to say my picture view and that's all I'm going to do for now.

20
00:01:29,910 --> 00:01:32,970
I'm going to say there's only one outlet in here.

21
00:01:32,970 --> 00:01:34,520
That's my picture view.

22
00:01:34,530 --> 00:01:37,380
And then we have to go back into our coding interface.

23
00:01:37,380 --> 00:01:41,740
And here is where things are a little bit different than what we have seen so far.

24
00:01:41,800 --> 00:01:42,630
Pick your views.

25
00:01:42,630 --> 00:01:49,200
They need a V to essentially populate the items let's say on items are going to be the names of some

26
00:01:49,200 --> 00:01:49,890
countries.

27
00:01:50,160 --> 00:01:56,660
So doesn't want to be calling that let's call it country is array.

28
00:01:56,700 --> 00:02:08,430
Going to be an array of strings and that is actually some countries Canada let's say U.S. let's say

29
00:02:08,670 --> 00:02:13,060
Mexico let's say India are not like that.

30
00:02:13,560 --> 00:02:17,290
India let's say Brazil.

31
00:02:17,520 --> 00:02:19,040
I'm going to have to.

32
00:02:19,350 --> 00:02:21,410
I can't think of anything Poland.

33
00:02:21,420 --> 00:02:27,420
So I've got some countries other than here and that's the area that they want to be using for my picture

34
00:02:27,420 --> 00:02:28,110
of you.

35
00:02:28,110 --> 00:02:35,490
Now so far in everything that we had done we had a system of saying for instance my picture view dot

36
00:02:35,730 --> 00:02:38,970
elements or dot components are these.

37
00:02:38,970 --> 00:02:45,030
But now things are a little bit different and the VBA to do it is using something called a data source.

38
00:02:45,030 --> 00:02:47,720
Let's see high data source essentially work.

39
00:02:47,960 --> 00:02:56,960
And when I go in here I'm to say my picture view dot data source is actually using something called

40
00:02:56,980 --> 00:02:59,580
you a picture view data source.

41
00:02:59,580 --> 00:03:03,560
I'm going to say that the source is self.

42
00:03:03,570 --> 00:03:09,600
Now you might be wondering this guy was asking for a UI data peak that a picture of your data source

43
00:03:09,600 --> 00:03:15,000
how are you assigning it to self undoing it just like the way we do with delegations.

44
00:03:15,000 --> 00:03:22,890
I'm going to say this is a self but then myself conforms to UI data.

45
00:03:22,920 --> 00:03:28,890
Pick that are you I picture view data source.

46
00:03:28,890 --> 00:03:33,360
So I'm saying the data source for picture view is in here.

47
00:03:33,840 --> 00:03:38,820
And then when I do that it's going to say well there are a few elements of this protocol that there

48
00:03:38,820 --> 00:03:39,660
must be.

49
00:03:39,660 --> 00:03:41,100
You can't skip them.

50
00:03:41,100 --> 00:03:42,890
I'm going to say at those stops.

51
00:03:42,890 --> 00:03:44,950
Show me the ones that I need to use.

52
00:03:45,120 --> 00:03:48,610
And it says these two things are absolutely necessary.

53
00:03:48,660 --> 00:03:50,990
You must have something in them.

54
00:03:51,060 --> 00:03:55,660
One of them is you have to decide how many components you have in your picture view.

55
00:03:55,800 --> 00:04:00,470
The other one is how many rows you have in each of the components.

56
00:04:00,480 --> 00:04:05,340
Now I know this system seems a little bit strange and perhaps it's the first time you're seeing it but

57
00:04:05,340 --> 00:04:10,410
this is something you have to get a really really comfortable with simply because this is the way we

58
00:04:10,410 --> 00:04:17,190
do a lot of different outlets UI table views your collection goes most notably and those two alone are

59
00:04:17,190 --> 00:04:20,520
like the fundamental part of most apps.

60
00:04:20,520 --> 00:04:24,640
So evade works is this once again to do a quick recap.

61
00:04:24,660 --> 00:04:32,280
It says this picture view finds its data from here from self the view controller and the view controller

62
00:04:32,280 --> 00:04:37,890
feeds the data to this view using these two functions at least.

63
00:04:38,010 --> 00:04:41,140
And there are other functions that we have to implement as well.

64
00:04:41,250 --> 00:04:46,770
But these two functions they return the value is that we need one of them returns.

65
00:04:46,770 --> 00:04:48,900
Let me format this properly.

66
00:04:48,900 --> 00:04:55,770
One of them returns how many components are there and the components are essentially how you break this

67
00:04:55,830 --> 00:05:00,340
into two vertical you know columns or three vertical columns.

68
00:05:00,420 --> 00:05:03,270
And that's something that we're going to be talking about in a while now.

69
00:05:03,390 --> 00:05:10,140
But for now I'm going to assume there's only one component so it returns one only one component would

70
00:05:10,140 --> 00:05:12,690
be in this picture view off line.

71
00:05:12,840 --> 00:05:19,440
Again the next thing is it saying how many elements you have in each of these components since I only

72
00:05:19,440 --> 00:05:20,650
have one component.

73
00:05:20,670 --> 00:05:23,900
I don't need to worry about the component itself.

74
00:05:23,970 --> 00:05:31,770
I just have to return the value and the value of it is return countries array that count.

75
00:05:31,830 --> 00:05:37,600
So how many components I have as many objects as there are in my countries every now.

76
00:05:37,740 --> 00:05:43,050
If we run this application right now it will know how many components it should have.

77
00:05:43,080 --> 00:05:49,830
It also knows how many elements should be in the component but doesn't know what should be there in

78
00:05:49,860 --> 00:05:53,380
each of these rows or each of these elements.

79
00:05:53,430 --> 00:05:59,220
Now to fix that what they have to do is this I have to rely on another function that is actually from

80
00:05:59,220 --> 00:06:00,820
your IP care of your data.

81
00:06:00,840 --> 00:06:05,990
Get that is gonna show me the specific value that they want on their role.

82
00:06:06,000 --> 00:06:08,790
So this one knows how many components are there.

83
00:06:08,790 --> 00:06:11,130
This one tells me how many roads are there.

84
00:06:11,130 --> 00:06:16,260
And then I have another one that tells me in each of the rows what you should show.

85
00:06:16,260 --> 00:06:21,490
And for that I need the you I picture view delegate protocol.

86
00:06:21,580 --> 00:06:23,850
I'm willing to stack all of them properly.

87
00:06:23,850 --> 00:06:29,290
So we have their view controller and then we have the picture view data source and picture view delegate.

88
00:06:29,400 --> 00:06:37,730
And since I'm using the delegation I have to go in here and say my picture view DOD delegate also becomes

89
00:06:37,730 --> 00:06:38,860
a self.

90
00:06:38,880 --> 00:06:44,910
Now my picture of delegate it has a function that shows me the title of each role.

91
00:06:44,910 --> 00:06:48,190
Let's go ahead and find that I'm going to go to the definition.

92
00:06:48,200 --> 00:06:49,980
I am here in the definition.

93
00:06:49,980 --> 00:06:56,700
I'm going to say that is actually called title for a role and it's an optional one simply because you

94
00:06:56,700 --> 00:06:57,810
may not have it.

95
00:06:58,110 --> 00:07:04,590
Maybe you just want to use the view for Adderall which is a you I view and you can attach things such

96
00:07:04,590 --> 00:07:05,970
as images to it.

97
00:07:06,090 --> 00:07:08,590
But for now I want to use the title for a role.

98
00:07:08,660 --> 00:07:10,950
I'm going to come back in here and say

99
00:07:14,520 --> 00:07:16,890
title for role.

100
00:07:17,130 --> 00:07:20,890
Let's stack things properly format them.

101
00:07:20,900 --> 00:07:25,920
He's asking me so you have X number of components and X number of rows.

102
00:07:25,980 --> 00:07:30,890
What do you want to show in each of those rows in each of those components.

103
00:07:30,930 --> 00:07:34,350
Since I only have one component I'm not gonna worry about this part.

104
00:07:34,470 --> 00:07:37,040
I'm only worried about this what it's saying.

105
00:07:37,170 --> 00:07:39,940
What do you want to show in that role.

106
00:07:40,060 --> 00:07:44,270
And I'm gonna say that value is a return countries array.

107
00:07:44,310 --> 00:07:50,110
Let me copy it and show me they have one at 2 draw.

108
00:07:50,700 --> 00:07:54,380
So if you're at the raw 0 show me countries are a zero.

109
00:07:54,390 --> 00:07:57,310
If you're either or 1 show me countries are at 1.

110
00:07:57,330 --> 00:07:58,790
So on and so forth.

111
00:07:58,830 --> 00:08:03,670
Let's run this application once the application load.

112
00:08:03,680 --> 00:08:06,220
You can see that now we have all of these elements.

113
00:08:06,230 --> 00:08:10,420
U.S. Canada Mexico India Brazil and so on and so forth.

114
00:08:10,460 --> 00:08:15,950
They're all here and we can you know go through them state the way you are expecting it to work.

115
00:08:16,250 --> 00:08:23,240
Now this was like a basic way of adding components as well as adding rose but the principle of it is

116
00:08:23,240 --> 00:08:24,140
very important.

117
00:08:24,140 --> 00:08:31,080
Understanding that you use the data source and delegate to populate your picture of you.

118
00:08:31,100 --> 00:08:34,230
I'm going to now copy out of these or actually cut all of this.

119
00:08:34,230 --> 00:08:35,630
Put them at the very bottom.

120
00:08:36,500 --> 00:08:37,820
Let's say about here.

121
00:08:38,540 --> 00:08:40,250
And what they wanted do is two things.

122
00:08:40,250 --> 00:08:44,120
One of them is I want to break this to have two components.

123
00:08:44,120 --> 00:08:48,700
Imagine we have countries and then for each country we have some cities.

124
00:08:49,010 --> 00:08:54,410
And also I want to know what happens when I tap on one of them when I change the value.

125
00:08:54,500 --> 00:08:56,240
Then I switch this to Mexico.

126
00:08:56,240 --> 00:08:59,100
How would I know it has switched to something.

127
00:08:59,150 --> 00:09:01,740
So let's go ahead and work on these two.

128
00:09:02,060 --> 00:09:07,550
Now here is the next very important thing which is actually different than what we had seen before.

129
00:09:07,550 --> 00:09:14,620
In the past we would use this outlet and we would use a value a changed event to actually change it.

130
00:09:14,960 --> 00:09:18,310
But the problem is the value change event in here doesn't work.

131
00:09:18,320 --> 00:09:26,130
We have to use a built in function which is called did select the raw so no coming here and say did

132
00:09:26,120 --> 00:09:27,260
select raw.

133
00:09:27,830 --> 00:09:35,630
And this is a function that says well in this particular picture of you you have selected a role that

134
00:09:35,630 --> 00:09:39,790
is at this particular location in this particular component.

135
00:09:39,890 --> 00:09:41,860
So it essentially gives us an address.

136
00:09:41,870 --> 00:09:48,290
It says you found that this particular one if you're very near and you switch this to India it would

137
00:09:48,290 --> 00:09:54,970
say in component zero you have chosen raw number three and that's very very useful.

138
00:09:54,970 --> 00:09:57,350
And I'm going actually print that's a print

139
00:09:59,780 --> 00:10:01,550
you select that.

140
00:10:02,150 --> 00:10:10,730
And the one I want I say selected is this I want to say you select the role you selected that say no

141
00:10:11,170 --> 00:10:20,880
of that in this play and print the components you selected that number in the component.

142
00:10:21,050 --> 00:10:22,700
And I'm also going to show its value.

143
00:10:22,700 --> 00:10:23,960
I'm going to say print

144
00:10:26,750 --> 00:10:28,920
its value is.

145
00:10:29,180 --> 00:10:32,540
And the value is this is going to be countries array

146
00:10:35,700 --> 00:10:38,370
and index all.

147
00:10:38,430 --> 00:10:41,480
So let's see if that works the way I'm hoping it will work.

148
00:10:41,550 --> 00:10:47,370
If it does every time that we change a value we select some roll it should tell us exactly what we have

149
00:10:47,370 --> 00:10:48,110
done.

150
00:10:48,120 --> 00:10:49,880
So let me show my concern.

151
00:10:50,010 --> 00:10:54,260
And in here I do want to see that here.

152
00:10:54,510 --> 00:11:00,020
It says you selected number one in component zero and its value is a U.S..

153
00:11:00,360 --> 00:11:01,690
Let me do another one.

154
00:11:01,800 --> 00:11:02,410
Brazil.

155
00:11:02,430 --> 00:11:04,680
It says the value is Brazil.

156
00:11:04,710 --> 00:11:06,600
And that's exactly the way I want it.

157
00:11:06,750 --> 00:11:08,540
Now the next thing I want to do is this.

158
00:11:08,580 --> 00:11:11,890
I want to go ahead and break this into two components.

159
00:11:11,970 --> 00:11:17,630
The first part of it should be self-explanatory number of components too.

160
00:11:17,820 --> 00:11:19,380
Now here is the problem.

161
00:11:19,470 --> 00:11:26,010
If the number of components are true then the picture of you number of rows in components should then

162
00:11:26,040 --> 00:11:27,090
be countries.

163
00:11:27,330 --> 00:11:32,520
Because right now it is returning the same value for both of the components.

164
00:11:32,520 --> 00:11:35,410
Let me actually show you what happens if we run this application.

165
00:11:35,410 --> 00:11:41,120
Now we should see two components side by side that they both showed the exact same thing.

166
00:11:41,130 --> 00:11:43,150
They are both exactly the same thing.

167
00:11:43,230 --> 00:11:47,860
And when we change one of them it says you select that number five.

168
00:11:47,880 --> 00:11:52,730
Let me move this for some reason dissimilar to sometimes doesn't move.

169
00:11:52,890 --> 00:11:55,020
That was actually a much worse thing.

170
00:11:55,020 --> 00:11:59,710
Okay so here it says you selected 5 in 0.

171
00:11:59,740 --> 00:12:05,760
And when I changed that one it says you select that number two in one eye as value is Mexico.

172
00:12:05,760 --> 00:12:08,730
So everything is working but obviously this is not really useful.

173
00:12:08,760 --> 00:12:13,140
So we have to have different type of content for the two components.

174
00:12:13,140 --> 00:12:18,480
So I'm going to come up here and say well I have the countries array and I'm going to have to have some

175
00:12:18,480 --> 00:12:24,820
cities array some say variable cities all right.

176
00:12:25,680 --> 00:12:29,660
That's to be array of strings.

177
00:12:29,730 --> 00:12:34,160
But the problem is I don't know which cities I have to show cities for Canada.

178
00:12:34,210 --> 00:12:35,080
It is where us.

179
00:12:35,140 --> 00:12:39,540
Is what makes the call which one is the one I'm trying to show I'm going to make this an empty one at

180
00:12:39,540 --> 00:12:45,890
the very beginning now to simplify my life I'm actually going to cut down on the number of the countries

181
00:12:45,920 --> 00:12:52,250
I'm going to only stick to two of them because those are the ones I can remember some cities from and

182
00:12:52,250 --> 00:12:53,620
I'm gonna say that.

183
00:12:53,930 --> 00:12:54,950
Let's call this one.

184
00:12:54,950 --> 00:12:58,750
Chan cities Canadian cities.

185
00:12:58,790 --> 00:13:09,390
That's going to become these let's say Vancouver and Toronto and Iowa.

186
00:13:09,980 --> 00:13:11,260
If that's how you spell it.

187
00:13:11,300 --> 00:13:11,850
I hope so.

188
00:13:12,500 --> 00:13:19,670
I'm not going to say I have another hour that is called the U.S. cities and that's going to become New

189
00:13:19,670 --> 00:13:23,760
York and Los Angeles.

190
00:13:23,930 --> 00:13:28,850
So I have these two and actually I don't need the two of them to be valuable because I'm not going to

191
00:13:29,270 --> 00:13:33,610
change their values anymore so I'm going to be keeping them the way they are.

192
00:13:33,610 --> 00:13:35,570
So I could actually make them let.

193
00:13:35,900 --> 00:13:39,360
So let Canadian cities let us cities.

194
00:13:39,450 --> 00:13:45,610
I actually could make my countries to be a let us vote because we're not changing any of these values.

195
00:13:45,710 --> 00:13:48,460
My cities are however does that change.

196
00:13:48,470 --> 00:13:54,070
So because of that I'm gonna say since at the very beginning we are in Canada.

197
00:13:54,140 --> 00:13:56,370
Let's make the cities right in view.

198
00:13:56,360 --> 00:14:01,050
Did Lord to be Canadian cities.

199
00:14:01,130 --> 00:14:06,230
So that part is taking care of our default cities are the Canadian cities.

200
00:14:06,230 --> 00:14:12,980
Now we also have two sets of components and I'm gonna come in here for the rose in the component.

201
00:14:12,980 --> 00:14:26,980
I'm going to say if we are in the first component if you're on the left side then return country's array.

202
00:14:27,150 --> 00:14:30,150
For some reason this country is a dozen autocomplete.

203
00:14:30,180 --> 00:14:38,130
I'm not sure what's happening countries a rate that count so the left side is the number of the countries.

204
00:14:38,190 --> 00:14:42,190
Else return.

205
00:14:42,320 --> 00:14:47,780
Cities are right because the right side is the cities that count.

206
00:14:47,910 --> 00:14:52,770
So left and right are going to show the right number of objects.

207
00:14:52,770 --> 00:14:58,590
Now I think I have to actually change these two to a little bit different numbers as well.

208
00:14:58,920 --> 00:15:01,640
Maybe I add one more value in here as well.

209
00:15:01,830 --> 00:15:05,450
So we have more in one of them and less in the other one.

210
00:15:05,460 --> 00:15:09,970
It doesn't really theoretically matter but just for the sake of the presentation.

211
00:15:10,140 --> 00:15:15,810
So you might pick your view and the number of rows depends on the component for one component is the

212
00:15:15,810 --> 00:15:18,560
country's The other component is the cities.

213
00:15:18,600 --> 00:15:24,480
Now you can imagine the very same thing applies to here to the actual title for the role.

214
00:15:24,600 --> 00:15:28,190
If we are on the left side we should see the name of the countries.

215
00:15:28,200 --> 00:15:31,140
If you on the right side we should see the name of the cities.

216
00:15:31,140 --> 00:15:36,020
So I'm actually going to copy that say here.

217
00:15:36,840 --> 00:15:45,410
If component is 0 return countries array the value that you have for role.

218
00:15:45,420 --> 00:15:47,270
This is essentially giving us an address.

219
00:15:47,280 --> 00:15:51,290
It's saying in this picture view in this particular component this particular role.

220
00:15:51,300 --> 00:15:52,860
What would you like to show.

221
00:15:52,890 --> 00:15:55,060
I'm saying if component is 0.

222
00:15:55,230 --> 00:16:06,540
Then show the country's if component is 1 which is the else in here then show cities roll just like

223
00:16:06,540 --> 00:16:07,180
that.

224
00:16:07,320 --> 00:16:10,820
Now obviously this needs to be an else if situation.

225
00:16:10,830 --> 00:16:14,040
But I only have two components so I don't care about that.

226
00:16:14,040 --> 00:16:19,370
Also you might want to check for your picture of you but they also again have only one picture view.

227
00:16:19,400 --> 00:16:25,650
So it doesn't really matter in this case then let's keep it up to here and run the application by now

228
00:16:25,650 --> 00:16:29,430
we should see the right thing on the left and the right thing on the right.

229
00:16:29,790 --> 00:16:32,280
But then there's still something missing.

230
00:16:32,280 --> 00:16:34,060
So Canada is showing the cities.

231
00:16:34,170 --> 00:16:41,670
And if I go in here and I touch that it says you select that number one in one by sprinting the wrong

232
00:16:41,820 --> 00:16:44,670
values in here it's a still saying yes.

233
00:16:44,730 --> 00:16:51,390
And also if I switch this to us I should expect to see the U.S. cities to populate the right side of

234
00:16:51,390 --> 00:16:52,340
the component.

235
00:16:52,470 --> 00:16:54,090
So that's not happening either.

236
00:16:54,420 --> 00:16:56,100
Let's fix that.

237
00:16:56,100 --> 00:17:01,760
I'm going to come in here and say in my bid select from this gets rid of all of these.

238
00:17:01,770 --> 00:17:03,590
Now let's think about this for a second.

239
00:17:03,600 --> 00:17:08,880
What should happen when we change a roll when we select a roll.

240
00:17:09,180 --> 00:17:16,050
If we change a roll in the component that is this one the left one the zero component.

241
00:17:16,230 --> 00:17:19,290
Then these cities should change.

242
00:17:19,290 --> 00:17:22,320
Otherwise we should just print what's the value.

243
00:17:22,350 --> 00:17:31,890
So I'm going to say if component is zero then we have to change these cities else.

244
00:17:31,950 --> 00:17:33,990
So let me write that comment.

245
00:17:34,180 --> 00:17:35,980
Change cities.

246
00:17:36,060 --> 00:17:39,420
Else we have to print.

247
00:17:39,420 --> 00:17:41,760
So how should we change it in here.

248
00:17:41,760 --> 00:17:46,140
So that really depends if we changed it to a road that is zero.

249
00:17:46,140 --> 00:17:48,500
We should see the Canadian cities.

250
00:17:48,570 --> 00:17:57,020
So I'm going to say within the components zero if role was zero as well that means Canadian.

251
00:17:57,050 --> 00:17:57,690
That's right.

252
00:17:57,720 --> 00:17:59,220
Canadian.

253
00:17:59,610 --> 00:18:03,240
Else it means us.

254
00:18:03,430 --> 00:18:14,130
Now if we selected in component zero rows zero say citizenry becomes Canadian cities.

255
00:18:14,130 --> 00:18:22,080
If we select the U.S. One say cities array because the U.S. cities I don't need any of that comments

256
00:18:22,770 --> 00:18:29,220
I'm actually going to go ahead and reformat everything getting control and I but if you were in the

257
00:18:29,220 --> 00:18:37,840
other component which is in here I'm just gonna say print the value print you select that.

258
00:18:38,170 --> 00:18:45,050
And what I want to see is the city's array and I want to show the role from it.

259
00:18:45,090 --> 00:18:49,770
So if you're in the other component not component zero.

260
00:18:49,890 --> 00:18:53,740
If we select that something we want to see which one we selected.

261
00:18:53,760 --> 00:18:59,280
Now before I run the application there's one more thing I still have to do and that is in year in component

262
00:18:59,280 --> 00:19:00,240
zero.

263
00:19:00,240 --> 00:19:04,010
When we change the values we manually change the arrays.

264
00:19:04,020 --> 00:19:10,620
We didn't actually implement that change in the picture view so I'm gonna see my picture view.

265
00:19:10,860 --> 00:19:17,770
Or you could use picture view because you're inside the function dot reload component.

266
00:19:17,850 --> 00:19:25,020
I'm going to say a reload component to one because component zero changes the values on component 1.

267
00:19:25,020 --> 00:19:30,330
Now let's go ahead and run this application and if it all works well we should be able to see both of

268
00:19:30,330 --> 00:19:35,970
the components properly relating to the content that they need to have currently viewing counter that

269
00:19:35,970 --> 00:19:38,760
we see the Canadian cities image zoom into it.

270
00:19:38,790 --> 00:19:44,370
I go through us we see the US cities we go to Canada it shows back again the Canadian cities.

271
00:19:44,640 --> 00:19:51,480
And if I select the city from the right component it says you select a funnel and if I go back to us

272
00:19:51,590 --> 00:19:57,570
and I select one it says you selected New York and that's pretty much all we have for that.

273
00:19:57,650 --> 00:20:03,770
The one thing I did tell you about that the design of this application is not really the right way.

274
00:20:03,780 --> 00:20:09,810
You probably want to do this you want to get your content placed them in a dictionary because imagine

275
00:20:09,810 --> 00:20:14,410
right now we only have a few different cities from different countries.

276
00:20:14,550 --> 00:20:20,070
If these were like 10 of them things would become very difficult to find out which one you are doing

277
00:20:20,070 --> 00:20:21,010
for which.

278
00:20:21,120 --> 00:20:24,580
And also there is no way right now to print the country.

279
00:20:24,600 --> 00:20:30,900
I can guess that we are in component 1 and for that component 1 I could get the selected the raw but

280
00:20:30,900 --> 00:20:33,040
again is not a very good approach.

281
00:20:33,060 --> 00:20:39,420
So you probably want to put all of your data inside a different system maybe a class or maybe at least

282
00:20:39,510 --> 00:20:43,910
a dictionary with arrays and names and cheese.

283
00:20:44,040 --> 00:20:51,900
So that's about that very important lesson on data sources as well as delegates and how to populate

284
00:20:51,990 --> 00:20:59,700
things such as picker views our table views collection views not directly but he's saying my picture

285
00:20:59,700 --> 00:21:06,980
view dot something right there by saying these are the different functions that help populating the

286
00:21:07,000 --> 00:21:14,720
values in those items based on a number of components number of rows title for them as well as a delegate

287
00:21:14,720 --> 00:21:20,900
method such as when you select something what should happen if you don't use the value changed we use

288
00:21:20,900 --> 00:21:26,600
the built in functions of the delegation let's keep it up to here and let's move on to our next lesson.