1
00:00:00,850 --> 00:00:01,310
Hello there.

2
00:00:01,630 --> 00:00:02,350
I'm GAFCON.

3
00:00:02,440 --> 00:00:04,760
And welcome back to Monday tutorials.

4
00:00:04,840 --> 00:00:07,560
In today's video we'll be talking about God.

5
00:00:07,660 --> 00:00:09,090
So what is a garden.

6
00:00:09,100 --> 00:00:13,660
It is a view group with some special attributes like corner radius and elevation.

7
00:00:14,140 --> 00:00:16,550
So let us design some study.

8
00:00:16,600 --> 00:00:26,030
Let's start with the new project let's call a project called tutorial so called tutorials led to the

9
00:00:26,030 --> 00:00:26,750
next button.

10
00:00:28,340 --> 00:00:32,950
Let's keep on minimum as he gets 15 y so that we can run our application on almost hundred percent of

11
00:00:32,950 --> 00:00:34,670
the devices running on in the wall.

12
00:00:34,940 --> 00:00:36,020
That's on the next button.

13
00:00:37,520 --> 00:00:40,740
Let's start with the activity.

14
00:00:41,280 --> 00:00:43,410
Let's call the full stop studios may not duty

15
00:00:48,050 --> 00:00:50,170
well under its rules building up project.

16
00:00:50,370 --> 00:00:56,450
So let's wait while the projects built and it's ready to go to use.

17
00:00:56,450 --> 00:00:56,980
Got you.

18
00:00:56,980 --> 00:00:58,670
We need to add a dependency ingredient.

19
00:00:58,730 --> 00:00:59,930
So let's do that first.

20
00:01:00,170 --> 00:01:00,940
So great.

21
00:01:01,220 --> 00:01:02,810
Let's go to the application redo.

22
00:01:03,470 --> 00:01:04,740
So come in here.

23
00:01:05,590 --> 00:01:06,810
Let's out the dependency.

24
00:01:06,960 --> 00:01:18,180
So implementation com that Android not support guard view hyphen re seven on the vision.

25
00:01:18,180 --> 00:01:24,620
So twenty six point one point 0 letting the greater well do the garden view.

26
00:01:24,870 --> 00:01:25,620
So let's begin.

27
00:01:26,220 --> 00:01:27,570
So let's start with the new iPhone.

28
00:01:27,590 --> 00:01:35,250
So coming to our activity mind on example let's get rid of this constraint level let's call it say cleaning

29
00:01:35,280 --> 00:01:35,760
allowed.

30
00:01:36,810 --> 00:01:39,780
OK let's give the orientation as well to go.

31
00:01:39,780 --> 00:01:41,590
So an indication where to go.

32
00:01:42,270 --> 00:01:48,230
Let's get rid of this text to.

33
00:01:48,640 --> 00:01:52,770
Let's start with this scroll mutilate will design multiple cards so that scroll.

34
00:01:53,230 --> 00:01:54,750
OK so scroll view.

35
00:01:55,360 --> 00:02:00,760
Let's give them a much better than height drop content.

36
00:02:00,850 --> 00:02:02,110
The thing about scroll viewers.

37
00:02:02,140 --> 00:02:05,390
It requires only one direct child view.

38
00:02:05,770 --> 00:02:11,470
So let's design a linear low Selina allowed with much better and drop content.

39
00:02:11,470 --> 00:02:13,890
Let's give the orientation a little tickle.

40
00:02:14,620 --> 00:02:19,340
Okay let's design a first card view.

41
00:02:19,360 --> 00:02:23,610
So card you were in March parent height wrap content.

42
00:02:25,300 --> 00:02:27,120
Let's define the layout.

43
00:02:27,310 --> 00:02:32,420
So let's define a linear allowed you so that everything's wrapped up properly.

44
00:02:32,620 --> 00:02:41,260
Selina allowed that much better until I dropped content orientation say vertical let's define a X move

45
00:02:41,270 --> 00:02:44,940
you so text you put much better and I drop content.

46
00:02:45,310 --> 00:02:48,780
Let's define some text and defined X we need a string.

47
00:02:48,790 --> 00:02:51,550
So let's go to our standard example.

48
00:02:51,550 --> 00:02:56,820
So resources values on string dot x.

49
00:02:57,250 --> 00:02:58,460
Let's define a string here.

50
00:02:59,620 --> 00:03:04,390
So let's call it SDR card text.

51
00:03:05,380 --> 00:03:12,320
So let's define in a string so this is a domain code text.

52
00:03:13,450 --> 00:03:16,780
So coming back to our allow file so let's use it here.

53
00:03:16,870 --> 00:03:24,470
So let's do your context let's say the preview let's bring it on the left hand side.

54
00:03:25,140 --> 00:03:25,600
OK.

55
00:03:25,610 --> 00:03:32,630
So as you can see we've got our text you but we can't see any card like structure right.

56
00:03:32,930 --> 00:03:33,800
So let's do that.

57
00:03:33,950 --> 00:03:36,030
So let's define the attributes for our card.

58
00:03:36,620 --> 00:03:49,980
So code corner radius let's give it say 40 B and let's knew at an elevation so elevation say to.

59
00:03:50,850 --> 00:03:52,110
OK.

60
00:03:52,220 --> 00:03:55,640
It doesn't look very clean so let's add some margin and padding.

61
00:03:55,880 --> 00:04:04,630
So let's give it some margin say 10 DP and let's give some padding say then.

62
00:04:05,950 --> 00:04:08,670
OK let's run an obligation and see how it looks

63
00:04:12,120 --> 00:04:13,710
what applications are running.

64
00:04:13,710 --> 00:04:14,770
So let's have a look.

65
00:04:16,610 --> 00:04:19,390
Well as you can see a guard is visible on its face.

66
00:04:19,400 --> 00:04:23,480
This isn't in context so let's add some changes you.

67
00:04:24,150 --> 00:04:33,550
OK let's create another card so let's just copy this let's just close this for a while.

68
00:04:36,750 --> 00:04:40,470
OK let's add an image here.

69
00:04:41,220 --> 00:04:46,380
So image view would match parent say height.

70
00:04:46,530 --> 00:04:47,580
Three hundred DP.

71
00:04:48,960 --> 00:04:49,950
Let's build on.

72
00:04:50,210 --> 00:04:52,760
That's see.

73
00:04:52,930 --> 00:04:57,080
Well I've got an image here so let's use that.

74
00:04:57,100 --> 00:04:59,150
Well let's face it on the JOY folder.

75
00:04:59,850 --> 00:05:01,190
So we've got our image.

76
00:05:01,320 --> 00:05:03,170
So going back to our project.

77
00:05:03,390 --> 00:05:04,580
So let's use.

78
00:05:04,620 --> 00:05:08,070
I see living room tiny.

79
00:05:08,820 --> 00:05:10,240
Let's remove the you.

80
00:05:12,960 --> 00:05:14,000
Let's order another.

81
00:05:14,670 --> 00:05:23,990
So another god view lots just space to two and that's about a combination of image you index to look

82
00:05:24,180 --> 00:05:26,240
much better and tight rock content.

83
00:05:26,550 --> 00:05:30,770
Let's provide the text so as to our context.

84
00:05:30,840 --> 00:05:36,290
Let's run our obligation and have a look.

85
00:05:36,700 --> 00:05:38,820
Our obligations running so let's have a look.

86
00:05:41,030 --> 00:05:43,000
We've got multiple guards here.

87
00:05:43,000 --> 00:05:45,160
The first guard just takes feels that can go on.

88
00:05:45,170 --> 00:05:46,460
We've got an image.

89
00:05:46,550 --> 00:05:49,490
The guard we've got a combination of our image on the decks.

90
00:05:49,490 --> 00:05:51,860
You have got this padding here.

91
00:05:51,860 --> 00:05:53,990
So I guess that's just the image botting.

92
00:05:55,040 --> 00:06:03,470
Well let's not about ground do our main layout so that the guards are more visible now.

93
00:06:04,200 --> 00:06:14,420
So coming to our main exit though let's just do it the background some background on droid color let's

94
00:06:14,420 --> 00:06:19,120
make it light gray again as displayed a hex code here.

95
00:06:20,220 --> 00:06:28,220
OK let's run our obligation again and have a look global obligations running so let's have a look.

96
00:06:28,970 --> 00:06:38,640
Now we've got a light gray background on our guards are more visible now so that's also got you.

97
00:06:38,870 --> 00:06:44,170
You fill it out anyways through the robot government I'm gonna go with my.