Welcome back and this video, we are going to set up the profile screen, as you can see here, my profile,
we have this little image here which will later be clickable so that we can edit the image.
Then we have the name that we can change.
Image is not changeable and then the mobile number and we can update that.
Of course, it's not populated yet.
That's what we're going to do in the next video.
But for now, we're just going to set up this activity as it is.
You can, of course, try to build it yourself.
What's important is that this email that it takes is not focused, so we cannot click on it and edit
it, OK?
Of course, they are not populated yet, so it doesn't make any difference.
But later on it will make a difference.
And of course, we have this little back button which then brings us back to our main activity.
So if you want to build this yourself, go ahead and try it yourself, please.
All right, so let's go ahead and do that if you want to do it together, and that's fine as well,
or if you just want to check how I did it.
So I'm just going to create a new activity here, new empty activity.
And I'm going to call this one my profile activity.
And of course, it should inherit from our base activity, so here, that's a base activity, then we
need to import our.
So let's do that because we are in an activities folder and it doesn't find out.
Now it does find it and now we will need to do multiple steps in here.
So, first of all, let's go ahead and make changes to the manifest.
So let's go to the manifest here.
We have this new activity somewhere.
There it is, activity, my profile.
And I want to use the same style for it.
OK, so I'm just going to add those two lines, as I have done with every other activity as well.
It's pretty remote.
And his team put the No Action Bar.
And then let's go to the activity, my profile example.
So here we will need to set up quite something.
And in order for this to not become a type fest, I'm going to go through it.
I have the code prepared here.
But before we do so, let's go to into our dimensions and the strings real quick so that we have the
right dimensions in there as well.
So the dimensions that I'm going to use are going to be the following ones, and it's quite some.
So that's a lot of different dimensions.
So let's look at those.
We have to screen content.
Margin start and end is going to be 16.
The screen content margin, top bottom will be 10 density pixels.
Screen content padding will be 16.
The user image size will be 100.
The margin top for the profile name will be 25.
The added text male margin top will be 20, then mobile margin top editors will be 20 and the button
up to the margin top will be thirty density pixels.
Now, at this point, you could, of course, say, all right, I would like to use the same margins
as we have done in other activities and other examples so that we always have the same sizes, so we
only change one of them.
That is something that you can do and that would probably be a better choice.
That but for other case or for the purpose of this video, it's a lot easier to just do it like this.
OK, so I'm just going to show you the dimensions here and then we're going to use them and then also
the strings that we're going to use.
It's not many, but still, let's add those in here so that we could potentially make our multilingual
later on so we can see here mobile update and my profile.
Those are the terms that are used here.
All right.
So now we can go over to our activity, my profile, and you can see it's a linear layout which has
a much and for with and the orientation is vertical.
And in there I have a bar layout with a toolbar.
So first of all, we start with this toolbar at the top.
You can see here this blue toolbar there, which has the HEPA overlay theme, which is the style that
we created ourself earlier on, which inherits from theme overlay compared to Dark Action Bar.
Then.
We have our toolbar here, which has only the bar size height, which has the color primary background,
which is the blue color and the Pop-Up Overlay as the Pop-Up theme.
And then we have a linear layout here.
So it's this background, linear layout here, which you can only see in the background.
And inside of that we have a card.
So we have this card in which we then have all of the other elements.
So the image to edit that it takes that it takes up update button.
OK, so linear layout, which is the background, which will also use icey background.
Which is adorable, but we have.
OK, then we have the card for you.
With the margins that we have prepared in the dimensions.
And a little elevation, which we also have in the dimension, so that it creates a little shadow.
We have a little corner around it as well, as you can see.
Well, you cannot see it in the design, but you will see it once it's in the application.
So if we go over to my profile, you can see that there is this little rounded corner here at the top
left or at all of the four sides.
Then we have another linear layout so that we can put, for example, the image view and edit text one
to text two and edit text three inside of it.
And then finally, we have our button at the very bottom.
OK, so this is nothing new.
So I think this should be fine that I just rush over it.
If you want to dig deeper into it, of course, check out the XML file, so download it and check it
out in more depth.
There's only one thing that I want to specifically show you, and that is this focus able or focus and
touch mode is set to falls for our combat, which is to email so far our email address.
We don't want to be able to edit it or we don't want to allow the user to edit it.
And of course, the import type is set to text email address so that the user gets the right interface
directly when clicking on it, potentially, of course, not on the screen.
So it doesn't really matter for us, but it's still a good practice to have that when you work with
emails.
But in this case, it wouldn't even really be necessary.
But I think it's still good for you to know that if you want to use email addresses, then use the input,
text, email address.
OK, so now we can go to our high profile activity and set that up, and it will be very similar to
what we have here regarding the action bar.
So let's set up the action bar here as well and the profile activity.
So set up action bar.
It's not to bar main activity, but it's the tool bar on the score and does give me something.
Yes, my profile activity.
And here we won't need those two elements.
So we don't have a navigation icon in there.
But we do have, however, is our action bar.
So Voll Action Bar should be a support action bar.
And then we check if the action bar is now, so if Action Bar is not known to be specific here, so
if it's not now, then set home.
Or display home is up enabled action bar set home display has enabled to truth and then Action Bar.
Set home as an indicator and here we use our dot drawable thought I see.
And here, black color or black color back, even though probably black is not going to be perfect for
this case.
So if you look at it, I could see that we're using a white color here.
So maybe we should use it or we should create another one, which is going to be.
The same one in white.
OK, so let's copy this.
And new or actually, do I have it already?
White.
I know I don't have it, so let's create the white version.
New vector, give it this name and then it's an arrow, so hopefully we find it.
Yeah, it's a throwback.
I was so let's put next Finnish and.
Actually, I gave it the wrong name.
It should be.
Back still here, but this should be white here.
What color back?
So let me see, and the project, if it created this drawable for me, I see black color back.
That is give us all the name.
Well.
And it seemed it did and and created for me, so let's go ahead and do that again, Victor.
Like this, I see white color back and the color should, of course, be white.
So here, six FS will do choose this next and then finish.
OK, and now it's it work.
And then, of course, we can set the title of the action bar as well.
So let's do that action bar.
The title should be something like my profile, even though here, of course, we should use a string.
Right.
So in order to use a string, what we can do is resources.
Don't get string, and then we get the string from our string thought, and here was my profile, even
though now that I see it, I think.
It would be better to call this one my profile title, to be more precise.
OK, so this is also something that you can then, of course, edit later on, but.
I personally think that's going to be a more descriptive string name, and then of course, I want to
give this action bar or this tool bar to be precise, to bar my profile activity I navigation on Click
Listener so that it does something and it should just do Hornback Prest.
All right.
So now, of course, we need to call this function in our uncreate function, so let's just do that
around here, set up action bar.
And now at this point, we should, of course, make sure that we can get there.
So where would be a good spot?
Well, in our main activity, because if you look at it when we're in the main activity and we press
on my profile, that's when we want to get here.
Currently, we just display this little toast here, which says toast, make text my profile.
Now, of course, we want to start an intent.
So let's start the activity here, start activity with the intent.
From this activity to our high profile activity, colon, colon, Kloster, Giwa.
All right.
At this point, we should be able to test it and hopefully I didn't get any minor bugs in there, so
things don't work as intended, but everything should be fine, I think.
All right, so that we are approaching Monash.
Let's go to the profile, my profile of a Muslim son, and you can see it works perfect.
Now let's click on email.
You can see we cannot access it.
We can access the others, however.
All right, so in the next video, we are going to populate the screen with the image to name and so
forth.
All right.
So see you in the next one.