1
00:00:01,160 --> 00:00:06,020
Welcome back in this video, we're going to adjust our code so that we can actually interact with our

2
00:00:06,020 --> 00:00:09,110
application because so far it doesn't really do anything right at this place.

3
00:00:09,110 --> 00:00:11,600
A lot then is but we cannot press any buttons.

4
00:00:11,600 --> 00:00:12,800
There is nothing to do with it.

5
00:00:13,040 --> 00:00:15,230
Just to look at it isn't interesting enough, I believe.

6
00:00:15,680 --> 00:00:19,040
Well, let's change that by actually adding a button to it.

7
00:00:19,490 --> 00:00:24,710
So what I'm going to do is here in the palette, I'm going to select a button and I'm going to drag

8
00:00:24,710 --> 00:00:26,330
it into my application.

9
00:00:26,690 --> 00:00:30,470
So let's just put it in here, and let's scroll in a little bit.

10
00:00:30,470 --> 00:00:36,590
You can see that now the button is in our application, it says Button, and it has the wall text Hello,

11
00:00:36,590 --> 00:00:37,640
Dennis underneath it.

12
00:00:38,480 --> 00:00:43,580
Now there is a little bit of a problem with this button because it doesn't have any constraints, so

13
00:00:43,580 --> 00:00:46,100
it would look like this here.

14
00:00:46,100 --> 00:00:51,830
But once we run it on our application, on our device, you can see we get this little error here.

15
00:00:51,950 --> 00:00:56,030
So let's look at it and we can see the button jumps over to the top left corner.

16
00:00:56,360 --> 00:01:00,830
And that is because we are inside of a constraint layout.

17
00:01:01,010 --> 00:01:07,760
You can see that and it needs constraints, so it needs to know where items should be displayed.

18
00:01:07,760 --> 00:01:11,480
And because our button doesn't have any constraints, it's just floating somewhere.

19
00:01:11,900 --> 00:01:17,180
It just thinks or assumes that we want to position it at the top left corner, which isn't what we want,

20
00:01:17,320 --> 00:01:18,470
what we actually want this.

21
00:01:18,470 --> 00:01:21,260
We want this button to be exactly where we have it right now.

22
00:01:21,770 --> 00:01:28,100
Now we can go ahead and magically infer constraints by clicking this button here, and then it will

23
00:01:28,100 --> 00:01:34,520
magically just add this constraint so that it just on top of our hello, then this text, which is thirty

24
00:01:34,520 --> 00:01:36,200
three pixels up from it.

25
00:01:36,620 --> 00:01:42,680
So if we rerun the application now, we should see that now our button will in fact be just on top of

26
00:01:42,680 --> 00:01:42,830
it.

27
00:01:43,430 --> 00:01:49,820
Now, cleaner way would be not to let Android Studio do it for us, but actually do it manually.

28
00:01:50,270 --> 00:01:58,370
Therefore, you can hold the mask button on top of the button and then drag this circle to the top,

29
00:01:59,210 --> 00:02:05,060
then drag this right circle to the right and the left circle to the left.

30
00:02:05,390 --> 00:02:08,630
So this will position the button towards the center.

31
00:02:09,080 --> 00:02:14,060
And then let's add another constraint so that it's connected to our Helo dense text.

32
00:02:14,600 --> 00:02:20,210
So now this button will have constraints and it will be centered pretty much between all of its constraints.

33
00:02:20,390 --> 00:02:23,120
That's the default we're going to later on.

34
00:02:23,120 --> 00:02:29,870
See how we can change the UI significantly by making a bunch more changes.

35
00:02:29,870 --> 00:02:32,450
But that's going to suffice for now.

36
00:02:32,450 --> 00:02:38,270
I but even though I would like this distance here to be a little less, what you can do is you can go

37
00:02:38,270 --> 00:02:45,200
to your layout here at the top right corner here and the attribute and then changed constraints that

38
00:02:45,200 --> 00:02:45,830
you want to have.

39
00:02:45,830 --> 00:02:50,600
So you can see currently to says that there is a vertical bias of 50 percent, which just means that

40
00:02:50,600 --> 00:02:53,000
it's in the middle on a vertical level.

41
00:02:53,000 --> 00:02:58,310
And the same goes for this horizontal bias, so it's 50 percent at the horizontal bias.

42
00:02:58,670 --> 00:03:03,350
So here, if you want to change that, you can click on this X button.

43
00:03:03,350 --> 00:03:08,570
It will delete this constraint entirely, but you can also overwrite the distance that you want to have

44
00:03:08,570 --> 00:03:08,810
here.

45
00:03:09,080 --> 00:03:14,540
So if I'm adding to, you can see now it takes the bias into consideration, but at the same time,

46
00:03:14,810 --> 00:03:17,570
it adds another 20 pixels distance.

47
00:03:17,990 --> 00:03:21,710
So if you were to add negative values, you would see it goes down here.

48
00:03:22,100 --> 00:03:23,150
So that would be one way.

49
00:03:23,150 --> 00:03:28,160
The other way would be to just drag this bias towards the bottom.

50
00:03:28,160 --> 00:03:30,650
So it's going to have a bias further towards the bottom.

51
00:03:31,100 --> 00:03:36,470
So this will make our button be closer to the hell of Dennis text.

52
00:03:36,860 --> 00:03:41,180
There are other ways to play around with it and change it, but I would just say for now, it's good

53
00:03:41,180 --> 00:03:42,890
enough to play around with the editor.

54
00:03:43,130 --> 00:03:46,880
Most of the time, however, in the future we're going to work with a coach, but I'm going to give

55
00:03:46,880 --> 00:03:53,090
you a pretty extensive introduction into what accent code looks like and how to use it for your purposes.

56
00:03:54,730 --> 00:03:59,920
So now let's make a couple of changes to this button that will be relevant, not just its appearance,

57
00:03:59,920 --> 00:04:02,620
but also what the text will say.

58
00:04:02,830 --> 00:04:07,990
So you can see once you click on this button and you scroll to the declared attributes, you'll find

59
00:04:07,990 --> 00:04:12,580
that it has a text which currently is just saying, Button, I want to change that.

60
00:04:12,580 --> 00:04:15,220
I want to tell it.

61
00:04:15,340 --> 00:04:15,910
Click me.

62
00:04:16,149 --> 00:04:17,980
OK, so it should just say click me.

63
00:04:18,130 --> 00:04:22,750
Once you enter it, you can see that the name or the text changes that disappearing on the button.

64
00:04:23,440 --> 00:04:30,100
Now there is an ID for any given item that you have in your user interface.

65
00:04:30,400 --> 00:04:38,260
At least you can set up an ID. This ID will allow you to access the UI element in your actual coat.

66
00:04:38,680 --> 00:04:45,050
So if I want to, for example, register I click on that button or a tap on that button in my code.

67
00:04:45,070 --> 00:04:50,890
I need to know which button was pressed because maybe I have five different buttons in there, so I

68
00:04:50,890 --> 00:04:57,400
always need to have an identifier or an ID, which tells us what item was pressed in this case.

69
00:04:57,490 --> 00:05:01,960
If the Click Me button was pressed and the ID would be for, that button would be just button.

70
00:05:02,260 --> 00:05:05,950
I would like for it to have the name my button like.

71
00:05:05,950 --> 00:05:10,750
So and then this rename option comes up and I can refactor it.

72
00:05:10,750 --> 00:05:15,570
So rename the ID source button and its usage to my button.

73
00:05:15,580 --> 00:05:18,520
So I'm just going to do that now.

74
00:05:18,520 --> 00:05:22,630
I can access my button and let's actually do that.

75
00:05:22,720 --> 00:05:26,260
Let's go to our main activity and let's access my button.

76
00:05:26,860 --> 00:05:30,340
Therefore, we need to get access to this button.

77
00:05:30,850 --> 00:05:34,560
Therefore, let's create a variable here by using the vault.

78
00:05:34,570 --> 00:05:35,100
Key word.

79
00:05:35,290 --> 00:05:38,470
We're going to see what this means in particular.

80
00:05:38,620 --> 00:05:45,580
Once you look at cortman fundamentals, but for now, just follow along because I want you to have an

81
00:05:45,580 --> 00:05:50,940
application that actually does something in this video and you're going to then step by step later on,

82
00:05:50,950 --> 00:05:53,800
understand how all of this is working.

83
00:05:54,250 --> 00:05:58,110
So first, we need to give this a name, and I'm going to call this one, click me.

84
00:05:58,120 --> 00:06:06,400
So button clicking and then I'm going to use the find view by ID method, and I need to say that I'm

85
00:06:06,400 --> 00:06:07,360
using a button.

86
00:06:08,020 --> 00:06:12,850
So you see, once I enter button and I press the enter key inside of those brackets here.

87
00:06:13,390 --> 00:06:15,910
You can see that this new widget here at the top pops up.

88
00:06:15,920 --> 00:06:18,280
So this new import, which says Android widget button.

89
00:06:18,700 --> 00:06:25,780
So this now allows us to use the button class, which basically says, OK, now we can use buttons in

90
00:06:25,780 --> 00:06:26,800
our Kotlin code.

91
00:06:27,640 --> 00:06:32,350
Now here in those brackets, here in those rounded the brackets, we need to say which button we want

92
00:06:32,350 --> 00:06:35,230
to actually find by its side, because that's what this method does.

93
00:06:35,530 --> 00:06:39,460
So it just says, OK, find a button by its ID, so find a view.

94
00:06:39,790 --> 00:06:42,400
If you could be a button, it could be a text.

95
00:06:42,430 --> 00:06:46,710
It could be any viewable item in your activity.

96
00:06:46,720 --> 00:06:47,590
Main example?

97
00:06:47,890 --> 00:06:49,300
So the button is of u.

98
00:06:49,510 --> 00:06:50,590
This text is a view.

99
00:06:50,920 --> 00:06:57,250
And while any of those like they also even have the name like image view, recycler view, they even

100
00:06:57,250 --> 00:06:58,630
have to view in their name.

101
00:06:59,110 --> 00:07:01,060
But you can access them directly.

102
00:07:01,570 --> 00:07:08,740
So here, let's say I want to find the button that was called my button.

103
00:07:09,280 --> 00:07:11,290
OK, so I gave it the name, my button.

104
00:07:11,860 --> 00:07:13,000
So now I can access it.

105
00:07:14,140 --> 00:07:15,730
Now this button clicked me.

106
00:07:15,940 --> 00:07:17,560
Let's quickly change.

107
00:07:17,710 --> 00:07:18,220
It's.

108
00:07:19,300 --> 00:07:23,470
Text to ha ha.

109
00:07:24,700 --> 00:07:30,820
OK, and then let's rerun the application real quick, just to see if we can actually access to a button

110
00:07:30,820 --> 00:07:34,630
and you can see now it says ha ha, and it doesn't say click me anymore.

111
00:07:35,080 --> 00:07:39,070
That's because what we did is here we got access to this button.

112
00:07:39,310 --> 00:07:46,080
And here at this line, we overrode the text of the button.

113
00:07:46,120 --> 00:07:49,480
So whatever the button shows us its content.

114
00:07:50,200 --> 00:07:51,820
So but that's not what I'm interested in.

115
00:07:51,820 --> 00:07:56,350
Usually what you want to do with buttons is you want to be able to click on them and then execute some

116
00:07:56,350 --> 00:07:56,650
code.

117
00:07:57,220 --> 00:08:01,840
So in order to do that, let's add an action to our button.

118
00:08:01,990 --> 00:08:05,020
So let's use this variable button.

119
00:08:05,020 --> 00:08:09,820
Click me in order to set an on click listener.

120
00:08:10,360 --> 00:08:13,720
So here if you enter this, you can see that there are multiple options.

121
00:08:13,720 --> 00:08:15,220
I want to use this one.

122
00:08:15,220 --> 00:08:17,470
Click listener with those curly brackets.

123
00:08:17,740 --> 00:08:19,120
So let's double click on it.

124
00:08:19,540 --> 00:08:25,570
And now inside of those brackets, I can now execute what I want to happen once I click on the button.

125
00:08:26,260 --> 00:08:32,830
So let's just use the same example that we just had where we just set the text to ha, for example,

126
00:08:32,900 --> 00:08:34,630
and I would say, you clicked me.

127
00:08:36,409 --> 00:08:37,280
So something like that.

128
00:08:37,820 --> 00:08:44,990
So now I'm changing the text of the button to haha, you click by executing this quote once we clicked

129
00:08:44,990 --> 00:08:45,530
on the button.

130
00:08:45,950 --> 00:08:52,940
So this on click listener is basically just the listening or waiting for us to click on the button.

131
00:08:53,630 --> 00:08:57,080
So what you're saying, OK, once we click on the button, do something with it.

132
00:08:57,320 --> 00:08:58,700
And what should we do?

133
00:08:58,730 --> 00:09:02,910
Well, everything that is inside of those curly brackets, which is in the current situation, just

134
00:09:02,910 --> 00:09:03,980
this one line of code.

135
00:09:04,370 --> 00:09:06,170
You can have multiple lines of code here.

136
00:09:06,500 --> 00:09:07,670
That wouldn't be a problem.

137
00:09:08,150 --> 00:09:09,950
You can see curly brackets here as well.

138
00:09:09,960 --> 00:09:15,620
So for example, this on create method here also has curly brackets and starts here, and it goes all

139
00:09:15,620 --> 00:09:16,400
the way down here.

140
00:09:16,790 --> 00:09:20,630
You can even press this minus button to see where it starts and where it ends.

141
00:09:21,050 --> 00:09:22,700
The same goes for our class.

142
00:09:22,850 --> 00:09:24,300
You see, it has curly brackets.

143
00:09:24,320 --> 00:09:27,470
It starts there and goes all the way up to Line 18.

144
00:09:27,830 --> 00:09:34,340
This is basically just the starting point here of this body of the code block, so to speak, and this

145
00:09:34,340 --> 00:09:35,270
is the ending point.

146
00:09:35,690 --> 00:09:40,810
And here this one is the starting point of this unclip lesson, and this is the ending point of the

147
00:09:40,820 --> 00:09:41,540
contact listener.

148
00:09:41,930 --> 00:09:47,570
So let's run this real quick just to see what's going to happen once we click on the button and you

149
00:09:47,570 --> 00:09:49,280
see it says, How are you clicked me?

150
00:09:49,820 --> 00:09:51,260
So well done.

151
00:09:51,260 --> 00:09:52,490
We changed a button.

152
00:09:52,490 --> 00:09:53,570
Click and it works.

153
00:09:54,050 --> 00:10:01,550
But now what I actually want to do is I want to access my text you because I don't want to change the

154
00:10:01,550 --> 00:10:02,900
text that is on the button.

155
00:10:03,290 --> 00:10:06,330
I actually want to change the text that is in my text too.

156
00:10:07,010 --> 00:10:08,570
So how could I access it?

157
00:10:09,560 --> 00:10:10,670
How could I change it?

158
00:10:11,330 --> 00:10:14,750
Well, it will be a similar approach to what we've done here.

159
00:10:15,140 --> 00:10:17,870
What we find the text by its ID.

160
00:10:18,500 --> 00:10:24,530
But instead of using a button here, we would use the same name that this item has here.

161
00:10:24,590 --> 00:10:28,190
So here at the top, it says text view.

162
00:10:28,250 --> 00:10:29,600
OK, so this is a b.

163
00:10:29,600 --> 00:10:33,440
This is a text you printed has the idea of to, in my case.

164
00:10:33,740 --> 00:10:38,090
So if you go to the code here and not the design, you can see that it is a text view.

165
00:10:38,540 --> 00:10:43,280
This is, by the way, also the internal class name that you would have to use in your main activity

166
00:10:43,700 --> 00:10:45,530
and you will have to import it the same way.

167
00:10:45,890 --> 00:10:50,480
So if you feel super confident and you really want to try it by yourself, I would recommend that you

168
00:10:50,480 --> 00:10:56,930
pass the video now and you try to access the text and change the text of the text view once it's clicked.

169
00:10:57,230 --> 00:11:02,060
It won't be easy, but you basically have to do a similar thing to what we have done with the button.

170
00:11:03,380 --> 00:11:08,240
OK, so I hope you pass the video and try it, this will not have been easy, but if you managed it,

171
00:11:08,240 --> 00:11:09,080
congratulations.

172
00:11:09,530 --> 00:11:13,210
So basically what you need to do is you need to get the ID off your text.

173
00:11:13,260 --> 00:11:17,420
You know, you can get the idea of the text or the similar way as we've done earlier.

174
00:11:17,430 --> 00:11:21,740
You click on the text view here and then you look at its I.D. right here.

175
00:11:22,160 --> 00:11:26,200
Now, if you want, you can change the ID, by the way, you can find the ID here as well, right?

176
00:11:26,210 --> 00:11:30,470
It's at the very top because it's very important, but you can change it from here as well.

177
00:11:31,160 --> 00:11:33,170
So in my case, it's called text with you.

178
00:11:33,170 --> 00:11:36,500
In your case, it might be called text view without the two at the end.

179
00:11:37,040 --> 00:11:40,280
So what's important is that you use the one that you have in your case.

180
00:11:40,520 --> 00:11:44,600
So I'm just going to change that to text you because it's very likely that you have the idea of text

181
00:11:44,600 --> 00:11:45,970
you in your case.

182
00:11:45,980 --> 00:11:47,660
So I'm going to refactor that real quick.

183
00:11:48,260 --> 00:11:50,320
OK, so this is now going to be my text you.

184
00:11:50,330 --> 00:11:51,380
That's the default ID.

185
00:11:51,860 --> 00:11:58,070
Of course, we could give it the proper name saying something like my no text view because I want to

186
00:11:58,070 --> 00:12:00,020
change it to be numbers later on.

187
00:12:00,410 --> 00:12:01,760
But for now, let's just use that.

188
00:12:02,030 --> 00:12:09,570
Let's go back to our main activity code and now let's create a vowel, and I'm going to call this TV

189
00:12:10,190 --> 00:12:15,380
my text view, and I'm going to find it by.

190
00:12:15,380 --> 00:12:21,440
It's I'd find you by ID, and here I'm going to use the text view, keyword.

191
00:12:21,800 --> 00:12:25,130
And then in the brackets, I need to give it all that ID.

192
00:12:25,730 --> 00:12:27,830
And I call the text to you, right?

193
00:12:28,400 --> 00:12:35,150
Text view like so now put complaining because text doesn't exist because it doesn't know what to do

194
00:12:35,180 --> 00:12:38,810
with this text you class, as it didn't know about the button earlier.

195
00:12:39,110 --> 00:12:45,860
But now what you can do is you can just right click into it and then show context, actions and then

196
00:12:45,860 --> 00:12:46,430
import.

197
00:12:47,030 --> 00:12:52,460
Alternatively, you can also hover over it and just press Alt Enter and then click on import.

198
00:12:52,460 --> 00:12:57,650
And it will add this import line here at the top, which now allows me to use to text view.

199
00:12:58,610 --> 00:13:00,140
OK, so now we have this text you.

200
00:13:00,170 --> 00:13:00,560
Cool.

201
00:13:00,770 --> 00:13:02,030
So let's go ahead and use it.

202
00:13:02,720 --> 00:13:06,590
Let's now instead of changing this button, click me text.

203
00:13:07,490 --> 00:13:09,680
Let's actually change the text of the TV.

204
00:13:09,680 --> 00:13:10,430
My text you.

205
00:13:10,940 --> 00:13:15,350
So I'm just going to use the text property again, and I'm going to use the equals sign.

206
00:13:15,560 --> 00:13:21,050
So this equals sign basically just assigns something to this text, and I didn't say that before, but

207
00:13:21,140 --> 00:13:22,580
that's what basically is happening.

208
00:13:22,940 --> 00:13:26,210
So I'm assigning something to this property here.

209
00:13:26,750 --> 00:13:30,260
So what is it that I want to assign to the text property of my text view?

210
00:13:30,620 --> 00:13:31,700
I want to assign.

211
00:13:31,700 --> 00:13:35,000
Maybe this just used as, haha, you clicked me for now.

212
00:13:35,870 --> 00:13:40,160
So now, once we click on the button, both of them will change to how you clicked.

213
00:13:40,400 --> 00:13:41,810
So let's test this real quick.

214
00:13:44,510 --> 00:13:44,870
OK.

215
00:13:45,620 --> 00:13:49,580
Click on it, and you see both of them have been changed to how you clicked me.

216
00:13:50,210 --> 00:13:51,980
Now that's not necessarily what I want.

217
00:13:51,980 --> 00:13:57,670
What I want instead is I want to write a little program that is going to be a people counter.

218
00:13:57,680 --> 00:14:02,990
So each time that I click on the button, the number that is displayed should be increased by one.

219
00:14:04,760 --> 00:14:10,730
So therefore, I'm going to create a new variable this time I'm going to use the VAR keyword because

220
00:14:10,730 --> 00:14:14,330
this is going to be a variable that will be changeable and we're going to see what that means later

221
00:14:14,330 --> 00:14:14,480
on.

222
00:14:14,480 --> 00:14:17,300
But no one variable now just follow along now.

223
00:14:17,720 --> 00:14:21,950
So here I'm going to call this one times clicked and I'm going to assign a value of zero.

224
00:14:22,460 --> 00:14:28,370
So this variable now is going to hold the amount of times that we clicked on the button.

225
00:14:29,180 --> 00:14:33,680
So what I'm going to do each time that we clicked on the button, which means that this code will be

226
00:14:33,680 --> 00:14:38,690
executed, I'm going to increase the value of this times, click by one.

227
00:14:39,530 --> 00:14:40,910
So let's do that real quick.

228
00:14:40,920 --> 00:14:42,020
Let's get rid of this button.

229
00:14:42,020 --> 00:14:43,400
Click me text here.

230
00:14:44,030 --> 00:14:48,980
Let's say times click will be equal the all time clicked value +1.

231
00:14:49,310 --> 00:14:52,220
So that's how you can assign a value here.

232
00:14:52,640 --> 00:14:55,330
This is just a slower way of saying it.

233
00:14:55,340 --> 00:15:00,680
Of course, you could have also just had plus equal and then get rid of this times clicked and this

234
00:15:00,680 --> 00:15:02,600
would have done the same trick.

235
00:15:02,720 --> 00:15:04,640
But that would go too far for now.

236
00:15:05,300 --> 00:15:07,910
It's just what Android Studio doesn't like.

237
00:15:07,910 --> 00:15:09,770
It just says, Hey, this is an efficient.

238
00:15:09,980 --> 00:15:12,140
Just do it quicker with this plus equals sign.

239
00:15:12,530 --> 00:15:15,800
So you can click this replace with and it will do the trick for you.

240
00:15:16,190 --> 00:15:18,110
OK, but I'm just going to keep it like this.

241
00:15:18,320 --> 00:15:20,360
So time's clicked will be the old times.

242
00:15:20,360 --> 00:15:25,880
Click +1 OK, and then we just need to assign the value of times.

243
00:15:25,880 --> 00:15:27,770
Click to our text view here.

244
00:15:28,370 --> 00:15:33,800
So instead of just saying, ha ha, you clicked me will want to display the amount of times we click

245
00:15:33,800 --> 00:15:34,490
on the button.

246
00:15:35,480 --> 00:15:40,700
Now the problem is that times clicked as a number, and if you look at this text here, it actually

247
00:15:40,700 --> 00:15:42,200
expects a text.

248
00:15:42,860 --> 00:15:48,290
So a string and not a number, and we can very quickly change that by using two string here.

249
00:15:48,620 --> 00:15:53,690
So that two string will just convert this text into a string and then this arrow pierce.

250
00:15:53,840 --> 00:15:56,420
So again, you don't have to fully understand what's up here.

251
00:15:56,450 --> 00:15:57,020
No worries.

252
00:15:57,020 --> 00:15:58,880
We're going to go over all of those things.

253
00:15:59,210 --> 00:16:05,750
The idea behind this video is really just to give you a quick result of having an application that you

254
00:16:05,750 --> 00:16:08,870
can then test on your own phone and just have available.

255
00:16:09,710 --> 00:16:16,820
So for now, let's go back to our activity main and let's change to text from Hello Dennis to, let's

256
00:16:16,820 --> 00:16:17,510
say, zero.

257
00:16:17,630 --> 00:16:18,020
OK.

258
00:16:19,110 --> 00:16:23,040
So text said it two zero, it will be this red zero.

259
00:16:23,250 --> 00:16:25,020
And now let's run the application.

260
00:16:27,620 --> 00:16:32,240
And let's click on the button, and you can see now changes magically to one, two, three and each

261
00:16:32,240 --> 00:16:33,510
time that we click on the button.

262
00:16:33,950 --> 00:16:36,410
The number is increasing by one.

263
00:16:36,920 --> 00:16:42,530
Now, if we were to close the application and would go back to opening it up, you could see it starts

264
00:16:42,530 --> 00:16:43,270
at zero again.

265
00:16:43,280 --> 00:16:47,420
Once we click on it, you can see the numbers go up consecutively.

266
00:16:48,530 --> 00:16:49,880
So what is going on here?

267
00:16:49,910 --> 00:16:51,110
Holy smokes, Dennis.

268
00:16:51,500 --> 00:16:56,180
Well, the thing is what we have done is we have our main activity coat.

269
00:16:56,600 --> 00:16:58,700
So this is the class in which everything happens.

270
00:16:58,700 --> 00:17:01,040
So this is the view in which everything happens, right?

271
00:17:01,400 --> 00:17:05,420
And then we said once the application is created, we want this code to be executed.

272
00:17:05,780 --> 00:17:11,630
And what basically happens is it sets the activity made as to lay out that this used, which is this

273
00:17:11,750 --> 00:17:18,319
XML file, which changed as Acxiom L file with our designer by dragging in a button, by changing the

274
00:17:18,319 --> 00:17:19,609
text view and so forth.

275
00:17:19,700 --> 00:17:22,730
And we gave those ideas that we could then access.

276
00:17:23,300 --> 00:17:29,900
Now in our main activity, we access them by using the find view by Edy method.

277
00:17:30,380 --> 00:17:35,910
This just allows us to say, OK, what is it that we are currently looking at?

278
00:17:35,930 --> 00:17:42,350
So we're searching for a button that has a certain ID, and we want to assign this to this variable

279
00:17:42,350 --> 00:17:42,950
called button.

280
00:17:42,950 --> 00:17:43,430
Click me.

281
00:17:44,300 --> 00:17:47,300
So we're doing that with this button, click me.

282
00:17:47,300 --> 00:17:48,980
We're doing that with our text view.

283
00:17:49,250 --> 00:17:56,330
This text you, by the way, is of the type text you and can very easily find that out by, well, either.

284
00:17:56,330 --> 00:18:00,620
Looking here, you see a text view is called text you and the button is called button, and you can

285
00:18:00,620 --> 00:18:01,430
also go to the code.

286
00:18:01,430 --> 00:18:02,870
You can see this is the text view.

287
00:18:03,290 --> 00:18:04,040
And this is the buttons.

288
00:18:04,040 --> 00:18:07,940
So these are class names that you need to import as your widgets.

289
00:18:08,030 --> 00:18:13,490
So import Android widget that button and we saw that this was done automatically for us by Android Studio.

290
00:18:13,520 --> 00:18:14,270
Thank you for that.

291
00:18:14,900 --> 00:18:19,250
And then we have this variable called times clicked and we use VAR here because we wanted to be able

292
00:18:19,250 --> 00:18:19,730
to change.

293
00:18:19,730 --> 00:18:23,000
But as I said, this will be something we will cover later on in more depth.

294
00:18:23,570 --> 00:18:28,070
And then we have this button clicked me this button that we have defined earlier.

295
00:18:28,340 --> 00:18:31,700
The cool thing is this button click meme comes from the tip button.

296
00:18:31,700 --> 00:18:32,930
So it is a type button.

297
00:18:32,930 --> 00:18:35,480
And the cool thing is this that buttons can be clickable.

298
00:18:35,870 --> 00:18:40,310
So there is this method called set on click listener that we can then execute.

299
00:18:40,760 --> 00:18:46,280
And basically, what we add as code inside of those curly brackets will be executed once we click on

300
00:18:46,280 --> 00:18:46,700
the button.

301
00:18:47,300 --> 00:18:50,180
So what we're doing now is we're increasing the value of this.

302
00:18:50,180 --> 00:18:55,280
Times clicked from zero to one, once it's clicked for the first time and then increasing it by one

303
00:18:55,280 --> 00:19:00,610
each time that it's clicked and we're changing the text entry.

304
00:19:00,650 --> 00:19:08,090
So the text property off our TV, my text view to be whatever the times clicked currently is as a string.

305
00:19:08,540 --> 00:19:11,300
So this line here, there's a lot going on here.

306
00:19:11,510 --> 00:19:16,640
So no worries if you don't fully understand each detail, but the general idea is hopefully graspable

307
00:19:16,640 --> 00:19:17,000
for you.

308
00:19:18,140 --> 00:19:26,090
Now, before we go to the next lecture, I want to quickly show you one last thing and that is how a

309
00:19:26,090 --> 00:19:26,840
toast works.

310
00:19:27,200 --> 00:19:29,180
So there is this beautiful thing called toast.

311
00:19:29,480 --> 00:19:30,440
Let's use it.

312
00:19:30,530 --> 00:19:37,700
It's not the thing that you can eat, but it's just something that you can write something on the screen

313
00:19:37,700 --> 00:19:37,970
with.

314
00:19:38,300 --> 00:19:44,610
So you use the keyword toast that make text, then you need to pass in the context.

315
00:19:44,630 --> 00:19:45,710
I'm just going to say this.

316
00:19:46,340 --> 00:19:47,810
Don't worry, just follow along.

317
00:19:48,410 --> 00:19:51,320
And then you say what you want to display.

318
00:19:51,710 --> 00:19:55,280
Hey, I'm a toast.

319
00:19:56,640 --> 00:19:59,790
And then you just say how long this should be displayed.

320
00:20:00,060 --> 00:20:03,930
And here you can just use toast length long.

321
00:20:04,530 --> 00:20:08,280
And then finally, we need to show this toast.

322
00:20:08,370 --> 00:20:09,790
OK, so don't show.

323
00:20:10,080 --> 00:20:15,360
So if you want to display this beautiful thing that I'm going to show you in a second, just add a coat

324
00:20:15,360 --> 00:20:20,190
like this and test it and you see it says, Hey, I'm a toast.

325
00:20:20,820 --> 00:20:24,060
You can also say something like, Hey, Dennis.

326
00:20:25,180 --> 00:20:25,990
Let's run it again.

327
00:20:28,080 --> 00:20:29,970
Click on it and see it says, Hey, Dennis.

328
00:20:30,720 --> 00:20:35,850
OK, so that's what you can do with toasts, and you don't need to understand what's going on here in

329
00:20:35,850 --> 00:20:36,090
depth.

330
00:20:36,090 --> 00:20:41,370
For now, the only thing that you need is this structure in general, and then you can just replace

331
00:20:41,370 --> 00:20:43,590
this text with whatever you want to display there.

332
00:20:44,400 --> 00:20:51,510
And we're going to see what make text means, what this means, what contexts are, what this length

333
00:20:51,510 --> 00:20:53,970
long is and what this show method is and so forth.

334
00:20:54,210 --> 00:20:55,830
You're going to learn about all of these things.

335
00:20:55,830 --> 00:21:01,560
This was just a little bit of an introduction and creating a small application that allows you to,

336
00:21:01,950 --> 00:21:02,960
well, do something.

337
00:21:03,030 --> 00:21:09,390
So now you can install this on your phone and you have your first little people counter where now if

338
00:21:09,390 --> 00:21:15,360
somebody comes into the bus and what you are as a teacher and you need to check how many children did

339
00:21:15,360 --> 00:21:19,420
come into your bus, you can just use this application now.

340
00:21:19,440 --> 00:21:20,280
Congratulations.