1
00:00:00,850 --> 00:00:01,359
Welcome back.

2
00:00:01,630 --> 00:00:06,430
And this video, we're going to add this little image button to our user interface so that we can click

3
00:00:06,430 --> 00:00:13,400
on it and then while it will ask us for permission so that we can access photos and media on the device

4
00:00:13,400 --> 00:00:16,930
so that we can then select an image that we want to use as the background.

5
00:00:17,230 --> 00:00:18,850
So for now, I'm not going to allow it.

6
00:00:19,600 --> 00:00:22,420
And we're going to look at permissions in the next video.

7
00:00:22,660 --> 00:00:26,380
But for this video, we just want to add this little layout here.

8
00:00:26,380 --> 00:00:28,360
So I would recommend that you try this yourself.

9
00:00:28,720 --> 00:00:30,270
And just a little tip.

10
00:00:30,820 --> 00:00:35,470
You should use a linear layout to put those two items next to each other.

11
00:00:35,680 --> 00:00:36,040
All right.

12
00:00:36,190 --> 00:00:38,560
So possibly and tried for yourself.

13
00:00:39,460 --> 00:00:41,260
OK, so I hope you tried it.

14
00:00:41,980 --> 00:00:44,470
Therefore, let's go ahead into our activity.

15
00:00:44,470 --> 00:00:47,750
Main example, and of course, we will need this draw.

16
00:00:47,830 --> 00:00:49,120
So I'm just going to.

17
00:00:50,490 --> 00:00:53,190
Paste is dribble in here, you can also just download it.

18
00:00:53,610 --> 00:00:55,440
It's just a little trouble here.

19
00:00:55,560 --> 00:00:56,850
I see a little gallery.

20
00:00:58,650 --> 00:01:00,930
You can, of course, use your very own image here.

21
00:01:01,500 --> 00:01:08,580
So now at the point where we have our image here at the bottom, so the image button, that's where

22
00:01:08,580 --> 00:01:09,750
we need to make the changes.

23
00:01:09,910 --> 00:01:16,170
OK, so we need to make sure that we add a linear layout surrounding it and then this image button can

24
00:01:16,170 --> 00:01:16,980
be inside of it.

25
00:01:17,370 --> 00:01:26,310
So let's go ahead and create a linear layout, and it should take a width of match parent and a height

26
00:01:26,310 --> 00:01:30,510
of rep content, so it should only take as much space as it requires.

27
00:01:30,840 --> 00:01:35,580
I'm going to make sure the gravity is towards the center so that the elements inside of it are going

28
00:01:35,580 --> 00:01:39,780
to gravitate towards the center on a horizontal level.

29
00:01:39,780 --> 00:01:44,460
So let's make sure that horizontal is also the orientation because otherwise that wouldn't work.

30
00:01:44,820 --> 00:01:48,630
And now we just need to make sure that this image button.

31
00:01:49,560 --> 00:01:55,680
So at least all of those properties here from the image button are now going to be the constrained properties

32
00:01:55,680 --> 00:02:01,920
of the linear layout because our image button will be inside of the linear layout.

33
00:02:01,920 --> 00:02:03,210
So let's cut it out from there.

34
00:02:03,210 --> 00:02:06,420
And let's put it inside of the linear layout.

35
00:02:06,810 --> 00:02:16,830
Now this linear layout needs an ID as well, and I'm going to call this one l l underscore action buttons

36
00:02:17,100 --> 00:02:19,440
because there are beautiful action buttons.

37
00:02:19,620 --> 00:02:23,730
Now, accordingly, of course, we need to make sure that our.

38
00:02:25,240 --> 00:02:30,460
Other linear layout here is on top of the action buttons.

39
00:02:30,790 --> 00:02:35,680
So here, bottom to the top of action buttons for the linear layout that is higher.

40
00:02:36,400 --> 00:02:40,090
OK, now we have our image button, which will be the brush.

41
00:02:40,600 --> 00:02:43,750
And this image button so far is fine.

42
00:02:44,080 --> 00:02:47,980
Now we can go ahead and to just duplicate it.

43
00:02:48,130 --> 00:02:51,390
So just put it on top because we want it to be left.

44
00:02:51,400 --> 00:02:54,790
So this other button, this gallery, but we want it to be on the left of it.

45
00:02:54,940 --> 00:03:00,850
So I'm going to call this one Iby gallery and it's going to use the icy gallery image.

46
00:03:01,690 --> 00:03:02,410
This one here?

47
00:03:02,620 --> 00:03:03,100
OK.

48
00:03:03,790 --> 00:03:05,560
And let's look at the design there.

49
00:03:06,110 --> 00:03:11,710
If this is what we got and you see, we have the two items next to each other, and that is because

50
00:03:11,710 --> 00:03:13,930
we put them into this linear layout.

51
00:03:14,680 --> 00:03:18,190
So image button and other image buttons are both in the linear layout.

52
00:03:18,490 --> 00:03:20,020
They have both the same settings.

53
00:03:20,170 --> 00:03:25,450
You can, of course, play around with those and they are oriented horizontally, which means this image

54
00:03:25,450 --> 00:03:30,910
button is going to be on the left and this image button is going to be on the right and they are gravitating

55
00:03:30,910 --> 00:03:35,710
towards the center so they're not cramped to the left or to the right there in the center.

56
00:03:35,710 --> 00:03:39,130
And that's something we get by using gravity's center here.

57
00:03:39,910 --> 00:03:40,450
All right.

58
00:03:40,660 --> 00:03:42,460
So let's check it out.

59
00:03:44,010 --> 00:03:49,800
And see if it's going to be inside of our user interface, and you could see there is our beautiful

60
00:03:49,800 --> 00:03:51,000
little gallery button.

61
00:03:51,360 --> 00:03:54,390
We can, of course, implement it, but we're not going to do it in this video.

62
00:03:54,390 --> 00:03:55,920
We're going to do it in the next one.

63
00:03:55,920 --> 00:04:00,990
Or at least we're going to look at the permissions first before we can then actually implement them

64
00:04:00,990 --> 00:04:02,160
into our application.

65
00:04:03,710 --> 00:04:04,730
So see you there.