1
00:00:00,990 --> 00:00:05,550
Come back in this video, I would like to believe this green here, you can see we have a result at

2
00:00:05,550 --> 00:00:10,740
the top here, then a little image to background that we used before and then a text view, another

3
00:00:10,740 --> 00:00:12,930
text view and then a text view and a button.

4
00:00:13,320 --> 00:00:17,260
And I would recommend that you try to build this UI yourself.

5
00:00:17,280 --> 00:00:23,700
You can download this trophy from the resources of this lecture, but you can also choose just another

6
00:00:23,940 --> 00:00:25,320
image that you want to use here.

7
00:00:25,650 --> 00:00:29,700
But generally speaking, you should be able to build this UI yourself.

8
00:00:30,360 --> 00:00:36,900
So I'm going to keep it simple this time I'm just going to paste it in and going to go over the details

9
00:00:36,900 --> 00:00:37,860
of what's going on.

10
00:00:39,620 --> 00:00:43,190
Therefore, let's, first of all, create a new activity.

11
00:00:44,350 --> 00:00:49,990
And I'm going to call it result activity, so here, empty activity.

12
00:00:51,170 --> 00:00:56,450
And result activity is the name for it.

13
00:00:57,200 --> 00:01:01,700
Let's generate it, and now let's go over to the XML file.

14
00:01:02,330 --> 00:01:04,489
As I said, I will keep it simple.

15
00:01:04,819 --> 00:01:10,080
And as I said, I will need the trophy, so you need to paste it in here.

16
00:01:10,130 --> 00:01:17,210
You can, just, as I stated, copy it from our project or you can use whatever image you want.

17
00:01:17,840 --> 00:01:22,250
Now let's go over to the code of this activity result x amount.

18
00:01:24,050 --> 00:01:29,660
OK, so first of all, I have a linear layout, so everything is inside of a linear layout.

19
00:01:29,960 --> 00:01:35,000
It matches the parent in both directions, which means it takes the entire screen as the background

20
00:01:35,000 --> 00:01:35,270
of it.

21
00:01:35,270 --> 00:01:40,100
I have defined this icy background image, as we have seen before.

22
00:01:40,550 --> 00:01:46,430
Then the orientation will be vertical, so the items inside of this linear layout are going to be on

23
00:01:46,430 --> 00:01:47,300
top of each other.

24
00:01:47,660 --> 00:01:51,590
The gravity will be center horizontal, so it will be centered horizontally.

25
00:01:51,920 --> 00:01:56,720
The padding will be to pick density pixels, which means that there will be an internal distance to

26
00:01:56,720 --> 00:02:00,320
the items inside of it of 20 density pixels, as you can see here.

27
00:02:01,100 --> 00:02:07,670
Then I have the first text you, which I gave the idea of TBE result.

28
00:02:07,970 --> 00:02:14,240
It wraps the content in with and height, and then the margin towards the top is going to be 20 density

29
00:02:14,240 --> 00:02:14,670
pixels.

30
00:02:14,690 --> 00:02:17,720
It just says result and the text color will be white.

31
00:02:18,260 --> 00:02:21,050
Text size is 25 and the textile is bolt.

32
00:02:21,530 --> 00:02:29,170
Then we have this image here, which is going to be the trophy, and I gave this the ID of Ivy Trophy.

33
00:02:29,660 --> 00:02:33,340
The content description is going to be that it's an image, OK?

34
00:02:33,350 --> 00:02:39,680
And it's wrapping its content in height and width, and the source for it will be this icy trophy.

35
00:02:39,950 --> 00:02:42,500
So this trophy image that we have here.

36
00:02:44,020 --> 00:02:48,140
Then we have this text you hear which says, Hey, congratulations.

37
00:02:48,460 --> 00:02:50,470
It has an idea of TV, congratulations.

38
00:02:50,890 --> 00:02:52,630
The width and height of our content.

39
00:02:52,810 --> 00:02:55,210
I have a little bit of margin towards the top.

40
00:02:55,630 --> 00:03:00,670
Text size is 25 as well as style is bold and the text color is white.

41
00:03:03,000 --> 00:03:06,340
Then we have another tax deal with the two names.

42
00:03:06,360 --> 00:03:08,760
This will be used to display the name of the user.

43
00:03:09,030 --> 00:03:16,590
Then we rip the content in terms of with it height and the margin top will be twenty five density pixels.

44
00:03:16,920 --> 00:03:19,080
The text color will be white.

45
00:03:19,200 --> 00:03:22,560
Text size 22 text style is going to be bold.

46
00:03:22,890 --> 00:03:27,540
Then we have this square where it says your score is nine out of 10.

47
00:03:28,020 --> 00:03:33,720
It has an ID. It's repping the content in width and height has a little bit of margin towards the top,

48
00:03:33,720 --> 00:03:39,570
as well as secondary text, dark color, which is going to be a darker color.

49
00:03:39,930 --> 00:03:42,830
And then we have the text size of twenty ISP.

50
00:03:42,840 --> 00:03:46,080
And finally, we have the button button finishes, how I call it.

51
00:03:46,590 --> 00:03:51,960
It's matching the parent in terms of width, so it's going to take as much space in terms of with as

52
00:03:51,960 --> 00:03:52,470
possible.

53
00:03:52,470 --> 00:03:56,360
And in my design, it doesn't seem to display correctly.

54
00:03:56,370 --> 00:03:58,260
Then we have the height of web content.

55
00:03:58,410 --> 00:04:04,380
The margin of ten identity pixels towards the top and I'm using their background color of white.

56
00:04:04,470 --> 00:04:07,920
So the background tint, that's what you have to set up for buttons.

57
00:04:07,920 --> 00:04:12,260
If you want to have a background color for them, the text will be finished and I'm going to use this

58
00:04:12,270 --> 00:04:15,300
design default color primary, which is this purple color.

59
00:04:15,630 --> 00:04:19,769
Text size 18 and textile will be bold.

60
00:04:22,630 --> 00:04:26,830
And in my case, the problem seems to be that the image view is just too big.

61
00:04:27,160 --> 00:04:35,170
So what we can do is, of course, we can define its width and height to be 200 deep, for example.

62
00:04:35,620 --> 00:04:38,200
And then this is how it's going to look like.

63
00:04:38,200 --> 00:04:41,030
Maybe we should make it a little larger.

64
00:04:41,050 --> 00:04:43,180
So something like 300 dpi.

65
00:04:43,570 --> 00:04:46,240
And then we will see that our user interface works.

66
00:04:46,270 --> 00:04:47,860
So we have our trophy.

67
00:04:48,280 --> 00:04:50,710
We have Hey, congratulations, username, your score is.

68
00:04:50,710 --> 00:04:52,390
And then finally, the finish button.

69
00:04:52,390 --> 00:04:58,390
So that's generally more or less how this design, as you can see here, is going to look like.

70
00:04:58,750 --> 00:05:02,150
By way, in my case, this has to do with the imagery that I'm using.

71
00:05:02,170 --> 00:05:06,310
Being way too big, you can, of course, change it in the designer here as well.

72
00:05:06,790 --> 00:05:13,900
You can make it wider and then you will see that it's going to zoom in a little bit.

73
00:05:14,110 --> 00:05:16,060
So that's what the designer can do for you.

74
00:05:16,060 --> 00:05:20,470
And then you see that the width, in fact, is going to be more like 300 dpi.

75
00:05:20,860 --> 00:05:24,820
So if we look at it now, I believe it looks a little better.

76
00:05:26,020 --> 00:05:26,410
All right.

77
00:05:26,740 --> 00:05:32,560
So that's it for this video and the next one, we're going to do the final touches so that we can actually

78
00:05:32,890 --> 00:05:39,640
start the activity for result from the very first beginning and then get the user name from it and as

79
00:05:39,640 --> 00:05:41,200
well as the score.

80
00:05:41,350 --> 00:05:46,630
So how many points we got, how many questions we have answered correcting.

81
00:05:46,900 --> 00:05:47,800
So see you there.

