1
00:00:00,800 --> 00:00:07,040
Next, we are going to implement the functionality to select a color so I can see we have a bunch of

2
00:00:07,040 --> 00:00:14,000
colors to choose from and then we can use that for the color of that particular card.

3
00:00:14,750 --> 00:00:15,170
All right.

4
00:00:15,170 --> 00:00:16,340
We can then update that.

5
00:00:16,340 --> 00:00:18,260
And for now, it will not store it.

6
00:00:18,260 --> 00:00:24,530
But basically, the idea is that the card itself will then have a top layer here, which will then say,

7
00:00:24,530 --> 00:00:27,390
OK, that this is a blue card, for example.

8
00:00:27,770 --> 00:00:28,130
All right.

9
00:00:28,130 --> 00:00:30,180
But this is for now what we're going to implement.

10
00:00:30,180 --> 00:00:33,740
So this a little additional dialogue here.

11
00:00:35,540 --> 00:00:35,930
All right.

12
00:00:35,930 --> 00:00:43,820
To get started, I think it makes sense for you to just download the latest strings and diamonds file.

13
00:00:44,390 --> 00:00:48,740
So here I mentioned that we're going to add are going to be the following.

14
00:00:50,290 --> 00:00:50,920
So.

15
00:00:52,540 --> 00:00:59,860
Item labeled color, height, label color, margin, color, selected image margin and so forth, that

16
00:01:00,010 --> 00:01:03,850
list kartu elevation and corner radius and so forth.

17
00:01:04,480 --> 00:01:11,710
OK, so just download the latest Dimond's file and also the latest strings file, because we are going

18
00:01:11,710 --> 00:01:15,090
to use one string here as well.

19
00:01:15,430 --> 00:01:19,290
Of course, you can also just type in the string because it's not that much effort.

20
00:01:19,690 --> 00:01:21,190
So it's the string.

21
00:01:21,200 --> 00:01:22,600
Select the label color.

22
00:01:25,020 --> 00:01:31,470
OK, so what we're going to need is a new layout, so I'm going to create a new layout resource file,

23
00:01:31,470 --> 00:01:35,160
which I'm going to call item label.

24
00:01:36,780 --> 00:01:37,260
Color.

25
00:01:39,210 --> 00:01:43,680
And it will be a frame layout as the root element, so let's create that one.

26
00:01:48,600 --> 00:01:56,460
And inside of this frame layout, I would like to use a new vector asset, so let's use the tick box.

27
00:01:58,680 --> 00:02:00,770
Actually, it's a check, this one here.

28
00:02:01,210 --> 00:02:04,090
I want to use the check and I'm going to call this one.

29
00:02:04,090 --> 00:02:07,450
I see Victor White.

30
00:02:08,509 --> 00:02:10,490
Don, 24 DP.

31
00:02:12,590 --> 00:02:19,640
And finish so inside of this frame layout, I would like to use it, so let me show you what this code

32
00:02:19,640 --> 00:02:20,420
is going to look like.

33
00:02:20,450 --> 00:02:26,560
So basically what we have is a frame layout which matches parathion with and wraps content in height.

34
00:02:27,020 --> 00:02:33,530
Then the foreground is set to attribute selectable image or Eitam background.

35
00:02:33,890 --> 00:02:39,980
Then we have a view here, which I call Dumain, which has a width of match parent.

36
00:02:39,980 --> 00:02:44,820
And the height is Eitam labeled color height, which is fauji density pixels.

37
00:02:45,260 --> 00:02:51,650
Then we have a layout margin, which I'm going to set to five density pixels and color and is used as

38
00:02:51,650 --> 00:02:52,610
the background color.

39
00:02:52,610 --> 00:02:56,050
For now, of course we want to adjust the color accordingly.

40
00:02:56,060 --> 00:02:59,260
And then we have this image here, which is basically the tick box.

41
00:02:59,270 --> 00:03:01,280
It has an ID.

42
00:03:01,280 --> 00:03:03,110
I've selected color.

43
00:03:03,380 --> 00:03:10,410
It represents content and height and weight and its center vertically and gravitated.

44
00:03:10,430 --> 00:03:13,740
So this means that it will basically look like what you can see here.

45
00:03:14,150 --> 00:03:18,150
So we have this little icon here on the right hand side.

46
00:03:18,170 --> 00:03:23,240
This is the selected check, which means that this is the color that we have selected so the user can

47
00:03:23,240 --> 00:03:27,040
select multiple different or from multiple different colors.

48
00:03:27,050 --> 00:03:27,560
Pretty much.

49
00:03:27,560 --> 00:03:27,800
Right.

50
00:03:27,830 --> 00:03:32,960
So we have this blue color, for example, and we, of course, want to adjust that for the different

51
00:03:32,960 --> 00:03:34,130
colors that we want to use.

52
00:03:35,090 --> 00:03:40,190
The visibility set to go on for this image of you and and the tools.

53
00:03:40,190 --> 00:03:41,210
We see it, of course.

54
00:03:43,380 --> 00:03:50,550
OK, so that is the individual item for the colors that we want to be able to use, but then we will

55
00:03:50,550 --> 00:03:52,230
need another XML file.

56
00:03:53,410 --> 00:03:59,860
Which I'm just going to call dialogue list, so here, dialogue on the score list.

57
00:04:01,670 --> 00:04:07,430
XML, and what that will do is it will be a frame layout also.

58
00:04:08,500 --> 00:04:14,440
And it will contain the following code, so let's look at it, you can, of course, also download this

59
00:04:14,440 --> 00:04:17,950
file if you don't want to type everything in here.

60
00:04:17,950 --> 00:04:21,320
So we use this frame layout, which matches the parent.

61
00:04:21,320 --> 00:04:30,700
Then it's a card view, which has a linear layout inside of it in which we have a TextView view and

62
00:04:30,700 --> 00:04:31,980
a recycler view.

63
00:04:32,560 --> 00:04:39,070
OK, so basically if we look at it, we have select and then we have it the separator and underneath

64
00:04:39,070 --> 00:04:42,860
we have a recycler view which we cannot see much of yet.

65
00:04:43,470 --> 00:04:50,500
OK, this recycle of you should be full of item labeled color XML files, so full of these kind of colors

66
00:04:51,070 --> 00:04:55,870
and then the user can use the one that he wants to use for the card.

67
00:04:57,110 --> 00:05:01,250
So basically, the dialogue list is this card here.

68
00:05:02,800 --> 00:05:08,200
With a select label, colored text and the separator and underneath where this recital of you with a

69
00:05:08,200 --> 00:05:14,830
bunch of items, label colors, which are the colors here that we can then select from.

70
00:05:17,100 --> 00:05:19,070
So this is how they are linked together.

71
00:05:22,230 --> 00:05:28,260
And of course, as we are working with a recycler view, we also need to have an adapter, so let's

72
00:05:28,260 --> 00:05:33,030
go ahead and create the new adapter inside of our adapters folder.

73
00:05:33,540 --> 00:05:35,430
So here you.

74
00:05:36,440 --> 00:05:40,670
Kotlin file, it's going to be a class called label.

75
00:05:43,010 --> 00:05:47,150
Color list items adapter.

76
00:05:48,740 --> 00:05:52,070
Pretty long name, but that's basically what it is and.

77
00:05:53,270 --> 00:06:01,670
The information that we need to pass in here is the context of private vital context, which will be

78
00:06:01,670 --> 00:06:02,870
of type context.

79
00:06:04,110 --> 00:06:04,500
Then.

80
00:06:05,540 --> 00:06:11,960
And I think it makes sense to put that into multiple lines, so we need to import context here and content

81
00:06:11,960 --> 00:06:20,720
context, then we have the list, private var list, which is an array, a list of strings, which are

82
00:06:20,720 --> 00:06:21,890
basically the color code.

83
00:06:23,040 --> 00:06:30,300
And then the private ball, um, selected color, which will be a string.

84
00:06:32,790 --> 00:06:38,640
Now, as this is an adapter we inherit from recycler, you dot adapter.

85
00:06:39,830 --> 00:06:42,080
Of type recycle of you.

86
00:06:44,760 --> 00:06:45,990
Thought V. Holder.

87
00:06:48,960 --> 00:06:49,470
All right.

88
00:06:50,310 --> 00:06:53,640
So this is how it's going to look like overall.

89
00:06:55,610 --> 00:07:01,760
They will call the items adapter, which is a recycled view adapter, and then, of course, we need

90
00:07:01,760 --> 00:07:04,740
to implement the functions that are missing.

91
00:07:04,760 --> 00:07:05,210
So.

92
00:07:06,740 --> 00:07:09,860
He wants me to make this abstract, what I want.

93
00:07:11,100 --> 00:07:17,670
But I want to implement the members so I have a overclass in implement members and then let's implement

94
00:07:17,670 --> 00:07:26,700
those members here, OK, so we have on create view holder, so get item count and so forth.

95
00:07:27,030 --> 00:07:29,520
So let's first start with the easiest one.

96
00:07:29,520 --> 00:07:30,420
Get item count.

97
00:07:30,420 --> 00:07:37,020
Let's get rid of that one or of the to do and let's just say return list that size.

98
00:07:39,220 --> 00:07:46,030
Then on create Holder, well, the thing is, as we are going to work with an item colliculus in there

99
00:07:46,030 --> 00:07:49,860
and with our class view older, let's just implement them real quick.

100
00:07:50,080 --> 00:07:59,680
So private class, my view, holder view view, which is going to be a recycler view.

101
00:08:01,090 --> 00:08:01,530
Thought.

102
00:08:02,620 --> 00:08:07,210
You hold her and we pass in The View.

103
00:08:10,150 --> 00:08:10,690
All right.

104
00:08:11,980 --> 00:08:20,320
So we need to import a view here, import AndroGel and then as we want to be able to click on the individual

105
00:08:20,320 --> 00:08:25,450
elements, let's add an on click listener, which is going to be an interface.

106
00:08:27,230 --> 00:08:34,010
Called on item click listener, where we have the unclick function, which will need the position and

107
00:08:34,010 --> 00:08:37,850
the color, which is a string, so we need to know which color we pressed on.

108
00:08:39,669 --> 00:08:43,030
All right, so now let's implement this uncreate view holder here.

109
00:08:44,300 --> 00:08:49,520
Which will return my view, Holder, that's the one that we have.

110
00:08:51,420 --> 00:08:52,470
Added at the bottom.

111
00:08:53,700 --> 00:08:59,130
And it should return my shoulder, so there what I want to return.

112
00:09:01,000 --> 00:09:04,960
As layout inflator from.

113
00:09:07,170 --> 00:09:08,070
Context.

114
00:09:10,880 --> 00:09:14,810
Inflates and then Artaud, Liautaud Eitam.

115
00:09:16,880 --> 00:09:18,830
Label color.

116
00:09:20,540 --> 00:09:23,090
Apparent and false.

117
00:09:24,140 --> 00:09:31,220
So we need to import our here and then we can use item label color, which is this XML file, so we

118
00:09:31,220 --> 00:09:39,800
inflate this XML file inside of our view holder for every single element.

119
00:09:40,550 --> 00:09:44,120
OK, so that's the idea behind this line of code.

120
00:09:44,600 --> 00:09:46,290
We've done that multiple times already.

121
00:09:46,670 --> 00:09:48,910
Now Unbind view Holder.

122
00:09:48,930 --> 00:09:52,580
So what do we want to find inside of the Bueler?

123
00:09:52,970 --> 00:10:00,500
Well, first of all, we will get the individual item that we look at, which is the item at the position

124
00:10:00,500 --> 00:10:03,100
of our list that we get passed.

125
00:10:03,140 --> 00:10:05,450
So the list of colors, so to speak.

126
00:10:08,110 --> 00:10:16,390
And then we can check if the holder is of type, my view Holder, if that's the case, then we can go

127
00:10:16,390 --> 00:10:17,680
ahead and design it.

128
00:10:17,680 --> 00:10:20,500
So item you view thart view.

129
00:10:21,560 --> 00:10:22,130
Main.

130
00:10:23,630 --> 00:10:26,030
Said background.

131
00:10:27,540 --> 00:10:28,230
Background, color.

132
00:10:29,440 --> 00:10:30,190
Which will be.

133
00:10:31,800 --> 00:10:34,620
Color, not pass color.

134
00:10:35,570 --> 00:10:39,110
Out of the item, OK, so what's happening here?

135
00:10:39,600 --> 00:10:44,140
You mean is this part here of our item little color?

136
00:10:44,150 --> 00:10:46,280
So if we look at it, it's this view.

137
00:10:48,200 --> 00:10:48,590
Then.

138
00:10:49,860 --> 00:10:56,820
We set the background color of that view based on the color DPAs, color item, so item, what is item?

139
00:10:56,820 --> 00:11:03,570
Item is the individual item of our list and then we pass it into a color.

140
00:11:03,580 --> 00:11:10,410
So if it's something like hash for six F's, then that will be, for example, white.

141
00:11:10,980 --> 00:11:18,420
If it's a bunch of zeros, then it will be, for example, like, OK, so this year is passed to us

142
00:11:18,420 --> 00:11:19,320
as a string.

143
00:11:20,310 --> 00:11:20,910
And then.

144
00:11:21,930 --> 00:11:25,580
It makes it color out of it, so this color makes them the color out of it.

145
00:11:28,410 --> 00:11:32,880
All right, on top of that, what I want to do is I want to make this item view.

146
00:11:33,860 --> 00:11:35,840
Or this image, you better said this one here.

147
00:11:35,990 --> 00:11:39,200
This tick box I want this to make.

148
00:11:40,160 --> 00:11:43,250
Or make this visible or invisible, depending on.

149
00:11:44,440 --> 00:11:46,990
Whether the item is the selected color or not.

150
00:11:48,000 --> 00:11:53,880
All right, so let's go back to our adaptor, we can here check if.

151
00:11:55,100 --> 00:12:07,730
Item is equal to M. Selected color, then we want to make this I've select color visible.

152
00:12:10,260 --> 00:12:16,740
His view thought visible and otherwise, I want to make it invisible.

153
00:12:17,340 --> 00:12:20,130
So basically this part here.

154
00:12:21,210 --> 00:12:22,860
Is equal to Gonne.

155
00:12:24,880 --> 00:12:28,340
And then, of course, every single individual element should be clickable.

156
00:12:28,360 --> 00:12:32,170
So if you click on Green, we want to have green and blue and so forth.

157
00:12:32,410 --> 00:12:32,860
All right.

158
00:12:33,810 --> 00:12:34,260
So.

159
00:12:35,570 --> 00:12:43,100
Let's make them clickable as well, so holder item you thought set on Click Listener if.

160
00:12:44,030 --> 00:12:54,770
On item click, listen, there is not equal now then I want to set it or set an unclick for it.

161
00:12:54,770 --> 00:12:57,590
So we need to create a variable for this, of course.

162
00:12:57,740 --> 00:13:02,900
So let's create a global variable here on top of the uncreate view.

163
00:13:02,900 --> 00:13:06,920
Holder So on item click listener will be a variable.

164
00:13:08,690 --> 00:13:17,000
Which will be of type on item click listener nullable, which I'm going to assign null to.

165
00:13:18,240 --> 00:13:23,220
OK, and now we can check is it now if it's not now?

166
00:13:24,770 --> 00:13:25,970
Then go ahead and.

167
00:13:27,200 --> 00:13:36,560
Set the on item click listener thought unclick with the current position and then we also need to pass

168
00:13:36,560 --> 00:13:38,120
in the item.

169
00:13:41,120 --> 00:13:45,080
So this item, which is part of list position, which is.

170
00:13:46,380 --> 00:13:51,960
What position as an entity about that position will give us a strain so here.

171
00:13:53,220 --> 00:13:54,660
A string of the array list.

172
00:13:57,060 --> 00:14:02,310
Because if you look at it, we can see unclick expects an integer and the color, and that's what we

173
00:14:02,310 --> 00:14:07,770
pass the position at the item, which is a color or a string, which then would be a color.

174
00:14:09,390 --> 00:14:15,420
All right, so next, we need to create this dialogue, because you can see once we click on it, it

175
00:14:15,420 --> 00:14:16,920
opens up this dialogue, right?

176
00:14:17,130 --> 00:14:20,970
It's nothing new TVT that we are populating or anything.

177
00:14:20,970 --> 00:14:22,350
It's just this little dialogue.

178
00:14:22,360 --> 00:14:23,150
So does pop up.

179
00:14:23,550 --> 00:14:26,750
And if you want to use dialogue, well, you need to create them.

180
00:14:26,760 --> 00:14:28,400
So let's create a new class here.

181
00:14:29,430 --> 00:14:30,300
Which will be.

182
00:14:31,210 --> 00:14:32,500
And sign of a new.

183
00:14:33,800 --> 00:14:37,310
Directory or package, and I'm going to call this one dialogues.

184
00:14:38,770 --> 00:14:47,140
All right, so let's create a new codling file for class, and I'm going to call this one label color

185
00:14:47,560 --> 00:14:49,240
list dialogue.

186
00:14:52,080 --> 00:14:54,000
And this one will be an abstract class.

187
00:14:58,520 --> 00:15:05,090
And abstract classes cannot be used to create objects from the OK, so classes cannot be instantiated,

188
00:15:05,180 --> 00:15:07,590
so you can create objects of an abstract class.

189
00:15:07,940 --> 00:15:09,950
However, you can inherit subclauses from them.

190
00:15:10,670 --> 00:15:16,940
OK, so I don't want to be able to create objects from them, but I want to directly access the.

191
00:15:18,140 --> 00:15:22,520
Elements of it, so here I'm going to need the context.

192
00:15:24,550 --> 00:15:30,760
Then the private var list of array list.

193
00:15:32,100 --> 00:15:32,670
String's.

194
00:15:36,710 --> 00:15:37,280
And then.

195
00:15:38,480 --> 00:15:41,300
I want to know the selected color so private.

196
00:15:42,430 --> 00:15:43,000
Vul.

197
00:15:44,200 --> 00:15:45,520
Unselected.

198
00:15:47,970 --> 00:15:52,410
Color, which should be a straight but away.

199
00:15:54,910 --> 00:16:03,460
We also need to title so private four or maybe Volle title should be a string of.

200
00:16:04,610 --> 00:16:08,780
An empty string, by the way, this one should be EVAR as well, so that we can change it.

201
00:16:09,050 --> 00:16:10,910
So it will be an empty string.

202
00:16:13,120 --> 00:16:22,330
In each cases, and we need to import context so that we can use it now, this whole class should inherit

203
00:16:22,330 --> 00:16:26,800
from the dialogue class because, well, it should be a dialogue.

204
00:16:26,800 --> 00:16:27,060
Right.

205
00:16:27,310 --> 00:16:32,710
And if you want to use the dialogue class to inherit from it, you need to pass in the context and you

206
00:16:32,710 --> 00:16:33,470
need to import it.

207
00:16:33,700 --> 00:16:35,890
So now we have dialogue and context.

208
00:16:38,210 --> 00:16:46,250
All right, so at this point, we can now implement this class, so private var, so first of all,

209
00:16:46,250 --> 00:16:50,450
I want to create an object of my adapter, which for now will be empty.

210
00:16:50,450 --> 00:16:56,600
So color list items, adapter nullable, which I'm going to assign null to for now.

211
00:16:58,950 --> 00:17:00,030
All right, and then.

212
00:17:01,140 --> 00:17:04,530
I need an uncreate here, so uncreate.

213
00:17:05,839 --> 00:17:07,859
What I want to do here?

214
00:17:07,970 --> 00:17:19,280
Well, I want to create a view which will be using the layout inflator dot from context thought inflate.

215
00:17:20,819 --> 00:17:27,800
DOT and humanity in Port Arthur as well, but this will allow us to inflate our own layout or be created,

216
00:17:27,810 --> 00:17:31,740
so it's inside of the layout folder and it's called dialogue list.

217
00:17:33,270 --> 00:17:34,230
Along list.

218
00:17:35,640 --> 00:17:39,360
So let's import our here so that we can use our dialogue list.

219
00:17:41,260 --> 00:17:50,490
And we also need to pass in the route when we call and flight and we're just going to pass here, OK,

220
00:17:50,500 --> 00:17:52,200
so we call the layout inflator.

221
00:17:52,210 --> 00:17:53,650
We create a new view out of this.

222
00:17:53,650 --> 00:17:53,880
Right.

223
00:17:53,890 --> 00:17:58,090
So based on this dialogue list, XML file that we created.

224
00:17:58,930 --> 00:18:07,720
OK, so now we have this new view and we can now set the content, set content view to be the view that

225
00:18:07,720 --> 00:18:08,820
we just created there.

226
00:18:09,610 --> 00:18:14,170
I'm going to set the cancelable on touch outside to Drew.

227
00:18:14,560 --> 00:18:19,900
So once we click next to it, you could see the dialog just disappears.

228
00:18:20,140 --> 00:18:21,460
So this is done by this set.

229
00:18:21,460 --> 00:18:29,890
Cancel on touch outside and I'm going to set cancelable to true so that it can be cancelled and I'm

230
00:18:29,890 --> 00:18:36,100
going to set up a recycler view which we need to create a function for.

231
00:18:36,580 --> 00:18:39,660
So let's create a function which will take care of the result of you.

232
00:18:39,730 --> 00:18:46,390
Private fund set up recycler view, which we need to pass on a view.

233
00:18:48,370 --> 00:18:55,870
And let's import viewers so that we can use it, and I thought you and here we can then design the view

234
00:18:56,050 --> 00:19:02,410
so we can just say view that TV underscore title or how did I call it to be title?

235
00:19:03,220 --> 00:19:05,450
I think that's what it takes to be a title.

236
00:19:05,980 --> 00:19:06,760
This one here.

237
00:19:11,240 --> 00:19:11,990
The text.

238
00:19:13,910 --> 00:19:21,440
Should be the title, and by this I mean the title that is passed to me, so to the label colored this

239
00:19:21,440 --> 00:19:23,060
dialogue class.

240
00:19:23,370 --> 00:19:27,050
So here probably it's empty, but we can override it, of course.

241
00:19:28,270 --> 00:19:28,690
Then.

242
00:19:30,630 --> 00:19:33,510
View that RV list.

243
00:19:34,980 --> 00:19:35,640
So the.

244
00:19:37,730 --> 00:19:38,390
List here.

245
00:19:39,570 --> 00:19:43,080
If we look at it, it's this recycled that you list are list.

246
00:19:45,620 --> 00:19:52,040
Let's set that layout manager to be a linear layout manager.

247
00:19:53,650 --> 00:19:55,090
Which also needs a context.

248
00:19:56,660 --> 00:20:04,280
And then we can set the adapter, so let's set the adapter to be label color items adapter, which need

249
00:20:04,280 --> 00:20:05,690
it needs a context.

250
00:20:06,660 --> 00:20:08,100
And what else does it need?

251
00:20:11,620 --> 00:20:13,300
The list and the select color.

252
00:20:14,420 --> 00:20:16,730
So let's passing the list.

253
00:20:18,270 --> 00:20:20,490
And selected color.

254
00:20:21,920 --> 00:20:25,880
And then we can set the adapter off our our V list.

255
00:20:27,210 --> 00:20:30,750
So here you are, relist thought adapter.

256
00:20:32,130 --> 00:20:34,060
Should be the adapter to be prepared.

257
00:20:36,310 --> 00:20:38,170
All right, now, every single adapter.

258
00:20:39,220 --> 00:20:45,160
Needs to have an on click listener, right, so adapter dot on item click listener.

259
00:20:46,670 --> 00:20:57,530
Should be a new object of label color list items the doctor thought on item click listener and here

260
00:20:57,530 --> 00:20:58,490
we can implement it.

261
00:20:58,970 --> 00:21:04,490
Okay, so we're creating a new object off label color items adapter on item click listener, which is

262
00:21:04,940 --> 00:21:07,160
this on item click listener interface.

263
00:21:07,590 --> 00:21:12,140
And now we need to overwrite its events so implement its members.

264
00:21:12,140 --> 00:21:13,730
So overwrite on click.

265
00:21:14,210 --> 00:21:18,050
And here once we click on the button what we want to do.

266
00:21:18,350 --> 00:21:23,820
Well we want to dismiss this dialogue and we want to say that we have selected an item.

267
00:21:24,510 --> 00:21:36,690
OK, so we need to create this additional function protected abstract from an item selected.

268
00:21:37,250 --> 00:21:42,170
So here we can then implement what should happen once we selected an item.

269
00:21:42,440 --> 00:21:46,790
OK, and we need to pass on the color of the item that we selected.

270
00:21:47,450 --> 00:21:52,310
OK, so here we just say it's abstract so that we can later on implement it.

271
00:21:52,310 --> 00:21:57,590
You know, our class as abstract as well, so we can now create abstract functions in here and it's

272
00:21:57,590 --> 00:22:00,440
protected so it can only be used inside of this project or.

273
00:22:01,190 --> 00:22:02,440
Yeah, that's pretty much it.

274
00:22:02,450 --> 00:22:02,630
Right.

275
00:22:02,660 --> 00:22:09,770
So here I can just say on it and select it should be called with the color that is passed to us as a

276
00:22:09,770 --> 00:22:17,640
string when we click on the item on the individual item of our adaptor.

277
00:22:18,620 --> 00:22:21,140
So here this is our recycler view.

278
00:22:21,200 --> 00:22:22,610
We used the adapter for it.

279
00:22:22,610 --> 00:22:26,510
We click on one item and that is pretty much what is then called.

280
00:22:26,510 --> 00:22:33,860
So the on item selected and the dialogue itself, as you can see, is also dismissed once I click on

281
00:22:34,250 --> 00:22:34,820
a color.

282
00:22:36,480 --> 00:22:43,200
OK, and now there's only this function to be left, to be called here, and we need to pass in The

283
00:22:43,200 --> 00:22:43,680
View.

284
00:22:45,090 --> 00:22:50,180
And luckily, we prepared a view already, which is our layout and later dialogue list.

285
00:22:50,700 --> 00:22:56,400
So at this point, I think we're going to make a pause because it's still a little bit to set up.

286
00:22:56,400 --> 00:23:02,220
So we still need to do all of the setting up in the card details activity itself, which will then,

287
00:23:02,220 --> 00:23:05,400
of course, use our label colorless dialogue.

288
00:23:05,400 --> 00:23:09,900
So you can see we created the adapter to be then displayed inside of the dialogue.

289
00:23:10,140 --> 00:23:13,220
So we create a new dialogue in the way that you can see here.

290
00:23:13,230 --> 00:23:20,070
So we pass in the context the list that we want to display in the dialogue that's not necessarily required,

291
00:23:20,070 --> 00:23:21,810
if you will ever want to create a dialogue.

292
00:23:22,020 --> 00:23:25,290
But in our case, we need to because our dialogue needs to display this list.

293
00:23:25,650 --> 00:23:31,440
Then I want to have a title for the list and I want to know which color is selected so that I can then

294
00:23:32,100 --> 00:23:37,950
make this color specifically different so I can make a tick box here, for example, which we don't

295
00:23:37,950 --> 00:23:38,970
have at that point yet.

296
00:23:39,150 --> 00:23:42,720
Even after finishing the next video, we will not have that yet.

297
00:23:43,120 --> 00:23:47,970
But overall, you can see we first of all, need to have an adapter, which is our little color items

298
00:23:47,970 --> 00:23:49,580
adapter that we created before.

299
00:23:49,920 --> 00:23:55,470
And then in the uncreate, we can inflate a view, which is the dialogue list view, which we prepared

300
00:23:55,480 --> 00:23:56,930
before this XML file.

301
00:23:57,450 --> 00:24:00,240
Then we can set that as the content view.

302
00:24:00,240 --> 00:24:02,310
We make it touch touch outside.

303
00:24:02,310 --> 00:24:02,730
True.

304
00:24:02,790 --> 00:24:04,880
So we can cancel it once we touch outside.

305
00:24:05,160 --> 00:24:11,460
Then we set up the recycler view and now we need to do a lot of coding inside of card details activity

306
00:24:11,460 --> 00:24:13,580
to actually add the functionality.

307
00:24:13,860 --> 00:24:17,040
It's not that much, but still we need to do that in the next video.

308
00:24:17,190 --> 00:24:17,580
All right.

309
00:24:17,580 --> 00:24:18,390
So see you there.