1
00:00:00,540 --> 00:00:05,010
Welcome back and this video, we are going to add this little fat button here, and once we click on

2
00:00:05,010 --> 00:00:08,580
it, it will open up this screen where we can create a board.

3
00:00:08,580 --> 00:00:10,610
So we have this image here at the top.

4
00:00:11,010 --> 00:00:13,590
Then we have the board name and we can create it.

5
00:00:13,600 --> 00:00:18,440
So once we click on the image, we then, of course, later on want to be able to select an image.

6
00:00:18,450 --> 00:00:19,640
But for now, it's going to be fine.

7
00:00:19,950 --> 00:00:25,110
So you can see the board gets a name and once we create, we want to create a board.

8
00:00:25,590 --> 00:00:25,950
All right.

9
00:00:25,960 --> 00:00:28,290
So let's go ahead and set everything up for this.

10
00:00:28,650 --> 00:00:33,990
You can, of course, try to build this yourself, like the whole part, actually, not just the part

11
00:00:33,990 --> 00:00:36,010
with the UI.

12
00:00:36,390 --> 00:00:37,500
So good luck with that.

13
00:00:38,820 --> 00:00:39,300
All right.

14
00:00:39,310 --> 00:00:41,310
So I hope you did it.

15
00:00:41,970 --> 00:00:46,440
Now, first of all, let's go to our activity Ximo.

16
00:00:49,050 --> 00:00:51,600
And I'm going to add that in our.

17
00:00:53,100 --> 00:00:55,470
Resources file here in the layout.

18
00:00:57,460 --> 00:01:05,050
AIPA Main Ximo, so here, just underneath the include statement, I'm just going to add a floating

19
00:01:05,050 --> 00:01:08,670
action button, so IFAB button, so to speak.

20
00:01:09,990 --> 00:01:11,500
And this is the code for it.

21
00:01:12,030 --> 00:01:18,810
All right, so you can see we'll need some dimensions and then you drawable here the vector add 24 DPE.

22
00:01:18,820 --> 00:01:20,490
So let's add that one real quick.

23
00:01:20,970 --> 00:01:22,590
New vector.

24
00:01:24,410 --> 00:01:26,510
And here, let's select add.

25
00:01:29,000 --> 00:01:29,570
This one.

26
00:01:30,630 --> 00:01:33,240
And then give it the name Victor Ed.

27
00:01:34,240 --> 00:01:34,810
And.

28
00:01:36,040 --> 00:01:37,370
Any info about the color?

29
00:01:37,390 --> 00:01:41,170
I think it was white or the sleeve with white and finish.

30
00:01:43,720 --> 00:01:48,940
OK, then I'm also just going to give you the dimensions that I'm going to use overall and by the way,

31
00:01:48,940 --> 00:01:52,860
I'm not going to go over the details of the UI.

32
00:01:53,440 --> 00:02:00,640
So these are the dimensions that I'm going to use the Web margin then to create board content, putting

33
00:02:00,650 --> 00:02:05,470
body image size, create material margin top and button, margin top.

34
00:02:06,460 --> 00:02:11,680
And now let's go ahead to the strengths and let's add some more strings in here as well, because we

35
00:02:11,680 --> 00:02:14,230
will need new strengths.

36
00:02:14,230 --> 00:02:21,970
One of them create more title, then the create button and the board name, which will be the name port

37
00:02:21,970 --> 00:02:22,240
name.

38
00:02:22,660 --> 00:02:27,580
OK, of course, later on you could go ahead and change those names any time you want it.

39
00:02:29,070 --> 00:02:34,910
OK, next, we need a board screen, so create board activity, so to speak.

40
00:02:34,950 --> 00:02:37,680
So let's go ahead and create a new activity here.

41
00:02:38,840 --> 00:02:40,830
Activity, empty activities.

42
00:02:40,850 --> 00:02:47,930
What I'm going to choose and I'm going to call this one, create board, activate the team.

43
00:02:50,400 --> 00:02:58,050
Once that is loaded, we can import our because our activities and activities folder right now, we

44
00:02:58,050 --> 00:03:07,530
can design the city, we t create board and I'm just going to use the following so you can see we have

45
00:03:07,530 --> 00:03:08,870
an Apapa here at the top.

46
00:03:08,880 --> 00:03:15,810
We have a cart view instead of this Carthew, we have an image view, which is this aged Oldendorf image

47
00:03:15,810 --> 00:03:16,880
view kind of thing.

48
00:03:17,220 --> 00:03:19,190
Then we have an edited text and create button.

49
00:03:19,350 --> 00:03:22,140
So let's look over it here real quick.

50
00:03:22,140 --> 00:03:26,630
We will also need a new image, by the way, so you can see I'm using a linear layout here.

51
00:03:27,180 --> 00:03:34,350
Then I have this bar layout with the toolbar, which is this airport here at the top, which allows

52
00:03:34,350 --> 00:03:35,880
me to also go back then.

53
00:03:36,480 --> 00:03:38,370
And it's fully customizable.

54
00:03:38,370 --> 00:03:40,140
So that's why I created it this way.

55
00:03:40,800 --> 00:03:42,180
Then I have a linear layout.

56
00:03:42,500 --> 00:03:48,360
Instead of that linear layout, I have my card view, which then in turn has another linear layout,

57
00:03:48,750 --> 00:03:57,000
which then has the overall image view, text input layout, which is an added text and the button.

58
00:03:57,730 --> 00:04:00,330
OK, so these are the elements that I used.

59
00:04:00,600 --> 00:04:05,460
If you want to know more about them, you can of course check them out to download the file and then

60
00:04:05,460 --> 00:04:09,000
you can see all of the different parameters that I'm using here.

61
00:04:10,380 --> 00:04:12,480
All right, then.

62
00:04:12,480 --> 00:04:14,400
Here I see a board placeholder.

63
00:04:14,400 --> 00:04:15,840
That's the image that we will need.

64
00:04:18,050 --> 00:04:24,020
Which I'm just going to paste in here so you can download an image for this, you can use any image

65
00:04:24,020 --> 00:04:24,600
you want.

66
00:04:24,620 --> 00:04:26,750
I'm just going to use this one, so.

67
00:04:26,750 --> 00:04:27,470
I see.

68
00:04:28,330 --> 00:04:35,710
Port placeholder, PNG, just this slightly grayish image, it's a little difficult to see here, but

69
00:04:35,710 --> 00:04:41,650
if you look at it here, you can see it's just this gray color basically around that gray color, which

70
00:04:41,650 --> 00:04:44,410
it then can replace later on.

71
00:04:45,790 --> 00:04:51,490
Also, by the way, we could see we are using a specific background image here, the one that we have

72
00:04:51,490 --> 00:04:55,200
used before, so that we stay in the same theme, so to speak.

73
00:04:56,720 --> 00:05:03,410
All right, so then let's go to our manifest first, because in our manifest, I always add the two

74
00:05:03,410 --> 00:05:07,460
lines here, this orientation, the no action bar to the new activity.

75
00:05:07,480 --> 00:05:12,440
So let's do the same thing with our create board activity here as well.

76
00:05:13,740 --> 00:05:14,200
All right.

77
00:05:14,220 --> 00:05:21,390
And at that point, we can go over to our activity itself, so to the create board activity and add

78
00:05:21,390 --> 00:05:22,380
the magic in here.

79
00:05:24,240 --> 00:05:31,150
So first of all, we all need to set up a bar and it's the same as in the other action bars.

80
00:05:31,170 --> 00:05:32,770
So let's go over here.

81
00:05:33,210 --> 00:05:36,450
We also have set up action bar function at that point.

82
00:05:36,450 --> 00:05:40,450
You we already think about reusing it.

83
00:05:40,470 --> 00:05:41,970
Actually, we don't have it here.

84
00:05:42,150 --> 00:05:43,030
We have it here.

85
00:05:43,110 --> 00:05:43,490
All right.

86
00:05:43,500 --> 00:05:45,120
So let's copy this one.

87
00:05:45,870 --> 00:05:52,290
It will be very similar to the action bar that we have in our my profile activity.

88
00:05:54,810 --> 00:05:56,190
So let's add that one here.

89
00:05:57,620 --> 00:06:00,650
So this time it's the toolbar

90
00:06:03,380 --> 00:06:10,310
underscore, create board activity, so it's just a name that is given here in the toolbar and activity

91
00:06:10,310 --> 00:06:11,880
create board XML file.

92
00:06:12,200 --> 00:06:15,150
So however you call it here, in my case, it's toolbar.

93
00:06:15,170 --> 00:06:16,340
Create what activity?

94
00:06:16,640 --> 00:06:20,650
That's the name that you should use here for the Support Action Bar.

95
00:06:21,220 --> 00:06:24,930
Then then you can of course, give it a title.

96
00:06:24,950 --> 00:06:27,160
I'm just going to leave it as is for now.

97
00:06:27,500 --> 00:06:32,400
And of course here it's not toolbar my profile activity, but it's to create board activity.

98
00:06:32,420 --> 00:06:37,520
We also set the navigation on Click Listener and say that Arnebeck press should be executed.

99
00:06:39,290 --> 00:06:45,350
And of course, let's call this set up a chamber function in our own create.

100
00:06:45,560 --> 00:06:48,650
So here, set up Action Bar.

101
00:06:50,510 --> 00:06:57,110
And then finally, we need to send the user to this create board activity from the main activity.

102
00:06:57,260 --> 00:07:00,980
So let's go back to our main activity and here.

103
00:07:02,680 --> 00:07:06,280
When we click on the plus button.

104
00:07:07,810 --> 00:07:11,080
Which means when we create or click on the.

105
00:07:13,330 --> 00:07:14,670
Fair button here.

106
00:07:16,520 --> 00:07:21,140
Fab Onas Create board set on Click Listener.

107
00:07:22,400 --> 00:07:28,670
It's what we want to do here, so once we click on this button here, this floating action button.

108
00:07:29,990 --> 00:07:31,130
Here at the bottom, right?

109
00:07:32,400 --> 00:07:38,640
That's when we want to start an activity, so here, let's start the activity.

110
00:07:41,100 --> 00:07:53,240
No result this time with the intent from this activity to the create or activity, colon, colon class

111
00:07:53,430 --> 00:07:54,240
or Java.

112
00:07:57,170 --> 00:07:57,770
All right.

113
00:07:59,680 --> 00:08:00,600
So let's test it.

114
00:08:03,200 --> 00:08:05,070
OK, so there we are.

115
00:08:06,080 --> 00:08:08,980
Now let's press the button.

116
00:08:10,200 --> 00:08:19,100
And that we are we're sent over to the port here, we can at the port name and we can create now it

117
00:08:19,110 --> 00:08:20,580
says project manager to top.

118
00:08:20,580 --> 00:08:22,140
Maybe we should give it a title.

119
00:08:25,100 --> 00:08:38,120
So here I can bar title is going to be the resources, and here it's our dot string dot.

120
00:08:39,320 --> 00:08:45,740
And what was it, create, bought and of course, its resources that get string.

121
00:08:47,310 --> 00:08:47,870
OK.

122
00:08:49,580 --> 00:08:50,370
So that was it.

123
00:08:50,390 --> 00:08:56,600
I hope you managed to get this more or less done or maybe fully done by yourself and in the next video,

124
00:08:56,600 --> 00:09:00,020
we are going to add some more functionality.

125
00:09:00,020 --> 00:09:01,580
So you can see there's still some.

126
00:09:02,480 --> 00:09:03,490
Stuff to do here.

127
00:09:05,850 --> 00:09:09,150
So let's test the plus button, create port.

128
00:09:09,630 --> 00:09:10,500
OK, perfect.

129
00:09:10,530 --> 00:09:11,360
See you in the next one.