1
00:00:00,330 --> 00:00:05,250
Welcome back and this video we are going to create to finish activity, which is the activity that you

2
00:00:05,250 --> 00:00:09,150
can see here, and this activity should come up once we're done with the exercise.

3
00:00:09,180 --> 00:00:15,670
So once we're done with exercise number 12 and then you can see this is what we should get.

4
00:00:15,690 --> 00:00:17,310
So a finish button here at the bottom.

5
00:00:17,310 --> 00:00:22,470
Once we click on it, we get back to the start activity or our main activity.

6
00:00:22,800 --> 00:00:29,560
And then you should also have this little text here and then a text there and a look shape.

7
00:00:29,760 --> 00:00:32,280
So this is something that you can try to build yourself.

8
00:00:32,290 --> 00:00:34,560
You should be able to do that by yourself now.

9
00:00:34,920 --> 00:00:40,280
And yeah, just see it as an exercise that's really good practice to do those things.

10
00:00:40,290 --> 00:00:43,720
And then once you're done, you can go ahead with the next video.

11
00:00:43,740 --> 00:00:47,580
But if you want to follow along with the video, you can do so, of course, as well.

12
00:00:47,910 --> 00:00:49,460
So let's get started.

13
00:00:51,760 --> 00:00:58,480
First of all, we need to create a new activity, so let's go ahead and create an empty activity and

14
00:00:58,480 --> 00:01:01,600
I'm going to call this one finish activity.

15
00:01:04,110 --> 00:01:06,510
And everything else should stay the same.

16
00:01:07,890 --> 00:01:08,550
Click, finish.

17
00:01:10,990 --> 00:01:11,750
And there we are.

18
00:01:12,220 --> 00:01:17,910
So let's go into the layout, out the finish layout, and I don't want to use a constraint layout here.

19
00:01:17,920 --> 00:01:20,140
I want to use a linear layout.

20
00:01:20,140 --> 00:01:23,170
So that's what I'm going to do, a linear layout.

21
00:01:25,020 --> 00:01:32,040
Then I want to have a toolbar here at the top, so let's go ahead and add one and I'm just going to

22
00:01:32,160 --> 00:01:33,120
base it in here.

23
00:01:34,140 --> 00:01:35,480
You can, of course, type it in.

24
00:01:36,030 --> 00:01:37,500
So that's a toolbar.

25
00:01:37,530 --> 00:01:38,790
You can see I gave it the name.

26
00:01:38,790 --> 00:01:40,490
I called it to finish activity.

27
00:01:40,830 --> 00:01:46,620
Then we have the width of each parent and the height of attribute action bar size.

28
00:01:46,630 --> 00:01:49,650
So this is a size that is predefined.

29
00:01:49,650 --> 00:01:53,250
The background should be wide and that's pretty much it underneath it.

30
00:01:53,280 --> 00:01:58,610
I want to have a text which should be called TV.

31
00:01:58,620 --> 00:02:05,160
And so this is going to be with a little margin towards the top that's going to wrap its content in

32
00:02:05,400 --> 00:02:11,390
with and height, it's going to say, and and it's going to have a text size of thirty five and the

33
00:02:11,430 --> 00:02:15,410
color accent, which is our green color as it's color.

34
00:02:15,810 --> 00:02:20,040
And then I want to have another linear layout which contains.

35
00:02:21,350 --> 00:02:28,430
The following elements here, you can see here this little circle, and in order to create that, we

36
00:02:28,430 --> 00:02:33,800
are going to use the color X and border again and an image of you.

37
00:02:34,010 --> 00:02:38,960
So I'm going to step in and explain them real quick so you can see I'm creating a new linear layout

38
00:02:39,230 --> 00:02:42,350
with a with and height of 150 density pixels.

39
00:02:42,680 --> 00:02:44,010
The gravity should be centered.

40
00:02:44,360 --> 00:02:46,430
The margin top is 15 density pixels.

41
00:02:46,430 --> 00:02:51,530
And I'm using the items circular color, X and border, which we've used before, which is just a stroke

42
00:02:51,530 --> 00:02:56,870
of five density pixels, which is green and has a solid background, which is white.

43
00:02:58,630 --> 00:03:04,540
Then I need an image of you and here I'm going to use this, I see action done.

44
00:03:05,290 --> 00:03:08,650
By the way, I have a little content description here with and height.

45
00:03:08,680 --> 00:03:10,180
So this is this little.

46
00:03:11,300 --> 00:03:17,450
I can hear and I will show you how to create that, let's create this little icon.

47
00:03:19,020 --> 00:03:22,530
So let's create this XML file.

48
00:03:24,050 --> 00:03:25,770
And I pasted the code in.

49
00:03:25,790 --> 00:03:32,360
So this is the code that you will need, and that is the width of 24 density, pixels, height as well.

50
00:03:32,840 --> 00:03:35,360
Viewport with is also said to 24.

51
00:03:35,810 --> 00:03:38,560
The tint is said to this green color.

52
00:03:38,810 --> 00:03:41,240
And I have an alpha of point eight.

53
00:03:41,240 --> 00:03:46,170
So it's slightly transparent and then I create a path here.

54
00:03:46,550 --> 00:03:49,430
So this path creates this little icon.

55
00:03:49,430 --> 00:03:51,980
And you could see this is the path data that I have here.

56
00:03:52,280 --> 00:03:56,120
It's a little confusing, but you can just use the path data here.

57
00:03:56,360 --> 00:04:02,180
If you want to know more about path data, you can check out the specification of operation that defined

58
00:04:02,180 --> 00:04:02,740
the path.

59
00:04:02,750 --> 00:04:08,600
So you should also check out the documentation for this, because basically what we are saying is I

60
00:04:08,600 --> 00:04:17,959
want to have a path which takes these coordinates and creates pretty much what we see here.

61
00:04:18,980 --> 00:04:21,649
So this little check, Eichen.

62
00:04:23,970 --> 00:04:26,350
There are, of course, many options how to do that.

63
00:04:26,580 --> 00:04:29,220
You can, of course, Google it, Android double check.

64
00:04:29,220 --> 00:04:31,170
I can and make a check.

65
00:04:31,170 --> 00:04:32,700
I can using XML drawable.

66
00:04:32,700 --> 00:04:34,740
So here, this is the check.

67
00:04:34,740 --> 00:04:35,130
I can.

68
00:04:35,170 --> 00:04:37,560
This one is a little different color, but there's no problem.

69
00:04:37,800 --> 00:04:40,180
And here this is a template that you can use.

70
00:04:40,200 --> 00:04:47,580
So he did it with a layer list here where he said, OK, we have one item, then we rotate that with

71
00:04:47,580 --> 00:04:53,220
a certain amount and then another item, which we were Tait's differently and so forth.

72
00:04:53,400 --> 00:04:53,810
All right.

73
00:04:53,820 --> 00:04:57,550
So there are multiple ways to get to the same solution.

74
00:04:57,570 --> 00:05:01,560
So that's why I think it's fine to use either way.

75
00:05:01,770 --> 00:05:04,740
In the end, what matters is what you get as a result.

76
00:05:05,250 --> 00:05:08,410
And this is just one way that I used with this little.

77
00:05:09,210 --> 00:05:14,340
So this is not something that you have to come up yourself, and that's not something that I would expect.

78
00:05:14,700 --> 00:05:15,050
All right.

79
00:05:15,060 --> 00:05:15,930
Just so you know.

80
00:05:17,560 --> 00:05:23,320
All right, coming back to the activity finished, you can see the problem disappeared and now.

81
00:05:24,450 --> 00:05:27,820
I want to have two textures underneath it, as you can see here.

82
00:05:27,840 --> 00:05:30,410
Congratulations, and then you have finished the work out.

83
00:05:30,630 --> 00:05:32,190
So let's add those two.

84
00:05:33,030 --> 00:05:38,880
And I'm just going to paste him in again because there's no use in you watching me type it all out.

85
00:05:38,880 --> 00:05:41,790
So you can see I just have this text called Congratulations.

86
00:05:41,790 --> 00:05:49,530
I have this dark gray color, 18 USPI, 25 density pixels as a margin top.

87
00:05:49,530 --> 00:05:53,400
So there is a little distance towards the top, as you also can see, of course.

88
00:05:53,410 --> 00:05:56,310
So there's enough distance between them.

89
00:05:56,460 --> 00:06:02,640
And then we have finally this finish button, which also has a little margin towards the top of in our

90
00:06:02,640 --> 00:06:03,390
case here.

91
00:06:03,490 --> 00:06:04,950
Thirty five density pixels.

92
00:06:04,950 --> 00:06:07,920
So I also gave it an ID so that I can access it.

93
00:06:07,920 --> 00:06:10,770
And once you click on it, something will appear.

94
00:06:11,010 --> 00:06:13,020
You can see the height is wrapped content and the width.

95
00:06:13,020 --> 00:06:17,400
I said match parent so it should take the whole with that is available.

96
00:06:17,670 --> 00:06:19,910
The level of gravity is search to bottom.

97
00:06:20,400 --> 00:06:24,480
The margin is set to or margin top at the 35 pixels.

98
00:06:24,480 --> 00:06:26,790
I have this color as the background color.

99
00:06:27,030 --> 00:06:33,750
The Texas finish and text color is a white color here and then of course 18 S.P. for the text size.

100
00:06:34,060 --> 00:06:41,910
All right, so that's the activity finish XML file then we should also check out the manifest.

101
00:06:42,240 --> 00:06:43,890
So let's go over to the manifest.

102
00:06:44,580 --> 00:06:47,310
We can see we have this new activity here.

103
00:06:49,630 --> 00:06:56,950
Actually, there it is, finished activity, and I also would like to add the same settings as I've

104
00:06:56,950 --> 00:07:03,970
done in the other ones, so I said the screen orientation to portrait and I said the action bar.

105
00:07:05,050 --> 00:07:07,240
Or the theme to no action bar.

106
00:07:07,420 --> 00:07:14,260
All right, so pretty much the same thing that I've done with the other exercises or the other activities.

107
00:07:14,740 --> 00:07:15,240
All right.

108
00:07:15,250 --> 00:07:16,930
So that's our interest manifest.

109
00:07:17,080 --> 00:07:22,410
And then we need a moment from which we get to this activity.

110
00:07:22,510 --> 00:07:24,400
So we need to add that at one point.

111
00:07:25,000 --> 00:07:26,230
So how do we get there?

112
00:07:26,590 --> 00:07:34,780
Well, I'd say we get there by going from our exercise activity because that's basically from which

113
00:07:34,780 --> 00:07:36,780
we should move over to the finish activity.

114
00:07:36,790 --> 00:07:39,450
So let's go to our exercise activity.

115
00:07:39,730 --> 00:07:46,310
And here we had this moment where the exercise timer went up.

116
00:07:46,330 --> 00:07:50,800
So here on finish inside of our set exercise progress bar.

117
00:07:51,840 --> 00:07:59,760
And there we have this on finish, and then we constantly went on and created the next exercise.

118
00:08:01,160 --> 00:08:01,730
I don't.

119
00:08:02,860 --> 00:08:07,870
You can see here there was only this little post saying, congratulations, you've completed the seven

120
00:08:07,870 --> 00:08:12,830
minutes work out now, of course, instead of just writing a toast here.

121
00:08:13,180 --> 00:08:17,100
I'm just going to do it with sending you to the next activity.

122
00:08:18,530 --> 00:08:21,260
So what I do is I finish first.

123
00:08:21,290 --> 00:08:26,000
So I finish the old activity, meaning the exercise activity.

124
00:08:26,010 --> 00:08:31,710
So then if we press the button that we don't get to the exercise activity, but we get back to the home

125
00:08:31,820 --> 00:08:38,030
screen or the start screen and the same, if we start an intent that we go to the start screen.

126
00:08:38,030 --> 00:08:42,980
So then we need to create an intent here and it's going to be of type intent.

127
00:08:44,120 --> 00:08:52,550
And here we need to import intent, so let's do that then I want to pass and this but in particular

128
00:08:52,760 --> 00:09:00,140
this exercise activity, because I need to pass in the context and in this case, this exercise activity

129
00:09:00,140 --> 00:09:00,950
is the right choice.

130
00:09:01,400 --> 00:09:07,400
And then I want to go ahead and pass in the class that I want to start.

131
00:09:07,490 --> 00:09:11,900
So finish activity is the one that I want to start.

132
00:09:11,900 --> 00:09:15,790
And I'm going to use the classical approach that we had here class, not Java.

133
00:09:16,190 --> 00:09:22,770
So when we do that, you can see that the arrows disappear and now we can start that intent.

134
00:09:22,790 --> 00:09:25,820
So let's go ahead and start.

135
00:09:27,420 --> 00:09:32,280
Activity with the intent that we created so intent.

136
00:09:33,580 --> 00:09:39,550
All right, so at this point, we can move over from our exercise activity to the finish activity,

137
00:09:40,160 --> 00:09:45,580
but now let's have a look at the finish activity, because in here we have nothing except for setting

138
00:09:45,580 --> 00:09:46,330
the content view.

139
00:09:46,330 --> 00:09:47,680
So nothing too fancy.

140
00:09:47,860 --> 00:09:53,320
But what I would like to have is I would like to add support action bar.

141
00:09:53,350 --> 00:10:00,220
So I'm going to set the support action bar to two bar finish activity, which is this two bar that we

142
00:10:00,220 --> 00:10:02,910
have had in here in our XML code.

143
00:10:03,670 --> 00:10:08,890
Then I want to have an action bar, which is a support action bar.

144
00:10:08,890 --> 00:10:11,320
So I'm going to go ahead and check.

145
00:10:11,320 --> 00:10:19,930
If that's not now, then I'm going to set the display home has enabled so this and empowers our back

146
00:10:19,930 --> 00:10:20,280
button.

147
00:10:20,710 --> 00:10:28,530
And then if we press that button, then I want to go ahead and call this on back prest.

148
00:10:28,540 --> 00:10:37,390
So if we press this toolbar finish activity, which is this toolbar button, so to speak, then I want

149
00:10:37,390 --> 00:10:42,580
to have this set navigation on this now, which means this back button when this was pressed.

150
00:10:42,580 --> 00:10:47,560
And I want to call this function on back press, which is the default functionality for on back pressed

151
00:10:47,740 --> 00:10:52,570
so that we'll try to do is go back to the last activity, which should be the exercise.

152
00:10:52,570 --> 00:10:58,900
But if the exercise is actually finished, that will not be the exercise, but it will directly be our

153
00:10:58,900 --> 00:11:03,070
main activity because here you can see we finish the activity.

154
00:11:03,070 --> 00:11:05,470
So it's multiple layers of activities.

155
00:11:05,470 --> 00:11:05,800
Right.

156
00:11:06,010 --> 00:11:09,610
And we start with our layer of the main activity.

157
00:11:09,790 --> 00:11:12,910
And then we put another layer on top, which is the exercise activity.

158
00:11:13,390 --> 00:11:20,410
And then once we are done with the exercise activity, what I say is get rid of this exercise activity

159
00:11:20,410 --> 00:11:24,280
layer and start this intent to go over to the finish activity.

160
00:11:24,520 --> 00:11:30,580
So pressing on this back button should not bring us back to the exercises because they are closed.

161
00:11:30,580 --> 00:11:33,640
So the stick is empty of it.

162
00:11:33,790 --> 00:11:35,030
So it's not there.

163
00:11:35,410 --> 00:11:37,450
The exercise activity is not on the stack.

164
00:11:37,660 --> 00:11:42,790
So it will just get rid of the current stick element, which is our fitness activity, and directly

165
00:11:42,790 --> 00:11:44,500
go to our.

166
00:11:45,460 --> 00:11:51,610
Starscream, and then what I, of course, want to do is I want to do something once we click on this

167
00:11:51,610 --> 00:11:52,240
finish button.

168
00:11:52,390 --> 00:12:00,190
So remember, we had this finish button here at the very bottom, so and here in our activity.

169
00:12:01,570 --> 00:12:02,440
If you look at it.

170
00:12:04,380 --> 00:12:09,630
And it seems we still have an error somewhere, so let's look at that linear layout.

171
00:12:11,010 --> 00:12:14,320
As it seems, the orientation is still missing.

172
00:12:14,460 --> 00:12:18,830
So let's add on an orientation here, said orientation.

173
00:12:18,840 --> 00:12:21,900
I kept my ID, doesn't want to play with me here.

174
00:12:21,930 --> 00:12:24,750
So orientation.

175
00:12:27,080 --> 00:12:32,350
Which I'm going to set to vertical because I want to put stuff on the left of each other.

176
00:12:33,440 --> 00:12:40,580
All right, so then this line is spread out, so we're not going to need that and now we can see our

177
00:12:40,580 --> 00:12:43,490
activity, you can see now this is how it currently looks.

178
00:12:47,380 --> 00:12:54,850
So I need to send her stuff still, and in order to do so, what we can do is we can add a line here,

179
00:12:55,330 --> 00:12:56,710
which is the gravity.

180
00:12:56,950 --> 00:13:02,470
So I'm going to set the gravity to center horizontal.

181
00:13:03,100 --> 00:13:04,300
Now, let's look at it again.

182
00:13:04,600 --> 00:13:07,630
And we can see now everything moved over to the center.

183
00:13:07,990 --> 00:13:10,260
OK, so that is our UI.

184
00:13:10,270 --> 00:13:14,570
And now once we click on this button finish, which is this big green button.

185
00:13:15,430 --> 00:13:22,690
This one here, then we will call the finish function, which is also built in function, which then

186
00:13:22,690 --> 00:13:29,920
just finishes the current activity and then goes back to the one on the and layer, which in our case

187
00:13:29,920 --> 00:13:36,840
means that it will directly go over to our start activity because that's the last one on the stack.

188
00:13:36,850 --> 00:13:37,150
Right.

189
00:13:37,630 --> 00:13:42,970
So the thing is, if you want to test that, then you will need to go through seven minutes of listening

190
00:13:42,970 --> 00:13:45,300
to the exercise names.

191
00:13:45,730 --> 00:13:52,270
So what I did and what I would also recommend you to do is to go to your exercise activity and then.

192
00:13:55,190 --> 00:14:01,340
Change to exercise time, duration from 30 to one seconds.

193
00:14:02,860 --> 00:14:08,830
And then to do the same thing with our waiting duration as it seems like.

194
00:14:09,100 --> 00:14:20,890
OK, so let's create another private bar rest time or duration, which I'm going to make a long as well,

195
00:14:20,890 --> 00:14:22,680
and I'm going to set that to one as well.

196
00:14:23,200 --> 00:14:26,380
So reset Oreste timer duration.

197
00:14:26,680 --> 00:14:28,650
I'm going to set that here.

198
00:14:30,310 --> 00:14:31,060
Time's.

199
00:14:33,440 --> 00:14:42,950
And then one thousand, all right, so this is the best progress bar countdown timer, so now we can

200
00:14:42,950 --> 00:14:44,360
directly change.

201
00:14:45,490 --> 00:14:51,670
The duration to just one second, for example, because this will make our life a lot easier when testing,

202
00:14:51,970 --> 00:14:59,710
of course, you can also go to your manifest and make your finish activity become your start activity,

203
00:14:59,710 --> 00:15:05,530
but then you can cause some other problems because your main activity will not exist in the stack.

204
00:15:05,680 --> 00:15:07,220
So you cannot really test it properly.

205
00:15:07,480 --> 00:15:09,220
So we need to go through this process.

206
00:15:09,430 --> 00:15:16,300
And I'm just going to post a video while I'm going through all of the exercises because it's going to

207
00:15:16,300 --> 00:15:17,230
create a lot of noise.

208
00:15:17,230 --> 00:15:22,280
So I'll just pause to be right here on the recording because you could see it's moving.

209
00:15:22,810 --> 00:15:23,080
All right.

210
00:15:23,080 --> 00:15:26,140
So here we are at the next exercise and there we are.

211
00:15:26,170 --> 00:15:30,850
So we went over to the screen and as you can see, it doesn't look as intended.

212
00:15:30,880 --> 00:15:32,820
So the background is still great.

213
00:15:32,830 --> 00:15:34,450
So let's take care of that.

214
00:15:36,000 --> 00:15:43,260
And by the way, it has to do with our activity here, so I'm using the no action bar theme, but I

215
00:15:43,260 --> 00:15:49,830
should use to light no action party because that will then get rid of this problem.

216
00:15:49,830 --> 00:15:54,810
And that was pretty much the same error that we or issue that we had when working with our exercise

217
00:15:54,810 --> 00:15:55,360
activity.

218
00:15:55,900 --> 00:15:57,200
Now, let's test it again.

219
00:15:58,800 --> 00:16:00,300
And let's see how it's going to look.

220
00:16:02,820 --> 00:16:03,690
So I started.

221
00:16:05,570 --> 00:16:06,720
All right, and there we are.

222
00:16:06,860 --> 00:16:14,360
So I ran through the exercises and you can see our screen, so we have the light no action bar theme

223
00:16:14,360 --> 00:16:17,310
here and things are looking good.

224
00:16:17,320 --> 00:16:22,760
So now let's press on the finish button and you can see we get back to the home screen now.

225
00:16:22,760 --> 00:16:24,060
Let's test it with the back button.

226
00:16:24,080 --> 00:16:25,220
Let's see what happens there.

227
00:16:25,310 --> 00:16:30,950
And by the way, if you don't want to go through all of the exercises once again, you can, of course,

228
00:16:30,950 --> 00:16:33,980
also change one more parameter here.

229
00:16:33,980 --> 00:16:39,050
And that is the question here, where you have this if statement.

230
00:16:40,600 --> 00:16:48,940
That is this one here where we checked in on finish exercise list size less than so and so.

231
00:16:49,270 --> 00:16:53,560
So what you can, of course, do and this is something that you should only do for testing because otherwise

232
00:16:53,560 --> 00:16:58,960
or at the next moment, you should definitely uncommented this again and replace the coat.

233
00:16:58,960 --> 00:17:04,359
But you can do something like less than two and then it will jump very quickly.

234
00:17:04,359 --> 00:17:10,150
So let's test that as well, because this is going to save you a lot of time when you test that many

235
00:17:10,150 --> 00:17:10,569
times.

236
00:17:10,599 --> 00:17:11,020
OK.

237
00:17:11,050 --> 00:17:15,460
In our case, we just tested very few times because it's rather easy.

238
00:17:15,630 --> 00:17:20,109
Well, sit and then see what is it and that we are.

239
00:17:20,319 --> 00:17:22,530
So you could even make it less than one.

240
00:17:22,810 --> 00:17:25,089
So it jumped directly to the finish screen.

241
00:17:25,089 --> 00:17:26,500
And now let's press the button.

242
00:17:26,500 --> 00:17:28,930
And you can see we also get back to the home screen.

243
00:17:28,930 --> 00:17:31,660
We don't get back to the exercise because that's important.

244
00:17:31,660 --> 00:17:37,060
We don't want to use it to get back to an activity out of which he cannot jump out because potentially

245
00:17:37,180 --> 00:17:39,730
he cannot get out of the exercise activity.

246
00:17:39,760 --> 00:17:43,210
Of course, you can also press the button again, but that's not good behavior.

247
00:17:43,390 --> 00:17:49,090
So that's also something that you always need to consider when building your UI and building your user

248
00:17:49,090 --> 00:17:49,720
experience.

249
00:17:50,290 --> 00:17:58,330
OK, so now I'm going to, of course, get rid of this line and uncommented this line so that things

250
00:17:58,330 --> 00:18:01,900
are as they were intended and then we're done with testing.

251
00:18:01,930 --> 00:18:07,090
So we know that now we can go ahead, of course, and change the rest time of duration to 10 seconds

252
00:18:07,090 --> 00:18:10,210
again and exercise time of duration to 30 seconds again.

253
00:18:11,200 --> 00:18:11,680
All right.

254
00:18:11,710 --> 00:18:12,780
And that's it for now.

255
00:18:13,270 --> 00:18:20,350
And the next video, we're going to create a custom dialog for the back information so that the user

256
00:18:20,470 --> 00:18:22,450
once he presses this button.

257
00:18:23,600 --> 00:18:29,720
He's getting stopped from it because maybe he accidentally presses this button and then he's exercise

258
00:18:29,720 --> 00:18:34,280
and he gets back to the start screens, and that's something that can be super annoying for a user.

259
00:18:34,360 --> 00:18:38,960
And that's also something that we need to really consider when building our application.

260
00:18:39,230 --> 00:18:41,330
OK, so see you in the next video.

