Welcome back.
We're almost there, we're almost at the point where we can finally sign up and sign in and do stuff
with Firebase, right.
So this is really what this whole application is about.
Right.
So I thought about different approaches when starting this up.
I thought about giving you, like, the whole structure before we even go into the firebase stuff directly.
So the whole project prepared so we can just start with the firebase stuff.
But I still think it's good to look at these minor additional features, which we have not used yet.
For example, changing the typeface, meaning changing the font and then using this handler and so forth.
So there are still some things that we have to cover when it comes to new features.
And as you can see, step by step, you're learning more and more about all of the different things
of Android and how to get things done.
So what we're going to do in this video is we're going to prepare to sign up screens so you can see
this screen here.
It's also very clean.
We just have this back button here, which brings us back to this activity.
And then we have the name email, password and sign up button.
And of course, you can try to set this up yourself.
It's going to be a little bit of effort, but in the end, it's going to be a great start for this application
because the Sinon will be very similar and it will just not have the additional line here.
One less added text.
OK, so let's get started.
All right.
First of all, we need to have a new activity.
So here, new empty activity.
Actually, there is something called new.
Logging activity.
Which is also something that you could potentially lose, but I think building it from scratch is going
to be the way for us.
So sign up activity.
It's going to be the name.
And then when we have the activity, it's always good practice to directly go to the manifest and make
changes.
So, for example, in our case, just the theme and the orientation.
So let's add that to this new sign up activity as well here.
So you can see now it also has to screen orientation and theme here.
All right.
So once that is done, we can go to the next step.
And the thing is, I'm going to use the material design of Google.
So if you want to use that, you always need to add that to your gradle.
So let's go to the great script and go to build that cradle and hear on their dependencies.
Let's add a new implementation.
So here implementation is going to be.
Come that Google, that Android, that material Kolon material, Colen 1.0 1.0.
All right.
So this is the implementation.
Once you have done that, you need to sink it.
So pressing now so that this gradle Project Sync is in progress and we can use the whole classes which
are inside of this dependency or this library that we're implementing here.
All right.
At this point, we can go to our activity, sign up XML and look at what we have here.
OK, so we will need some more dimensions and some more strings.
So let's add those real quick before we look into this file.
So here again, resources, values, dimensions.
So here we're going to have a bunch of new dimensions.
And you can, of course, add the details about this, so you could say something like the this is a
sign of activity.
All right, and there we have the sign up screen button margin, top title, text size authentication,
a screen content margin, top and so forth.
If you want to type that in, you can, of course, post a video and type everything in.
And then we also have to look at the strengths, so let's go to the strengths X amount and here I'm
going to add some more strings.
Which is just going to be generic, one sign up prescription text.
The name, password and email.
All right, now let's look up our sign up activity and check that one out.
So we need to have a background here for this.
So, of course, you could go ahead and use those drawable folders again and put them into the same
folder in your resources, so show an explorer.
And there to resources.
And paste that in here so that it will replace some files here.
And now we should have that icy background as well.
All right, so it's not complaining anymore, as you can see, we have a vertical orientation for our
linear layout and we have a toolbar at the top, which is the sign up toolbar so that we can have a
back button there.
Then as you can see, we have this text here added text three of them.
So to name, email, password and sign up.
And that's how it's going to look in the code.
So here is the text Vue.
Then.
You can see this takes two years, by the way, inside of this toolbar.
OK, so we created Toolbar, which has a height, which is the action bar size height, which comes
from the attribute.
Then we have our linear layout, which is vertical as well.
So stuff is put on top of each other.
And then inside of that we have one TextView, which is this TextView here.
There's one that you can see.
And then we have a card view, which is this beautiful little card which surrounds the three elements
here, or basically they are on top of this cart.
So we have this little card with those three added text and there's one button.
So view.
And inside of this card view, we have the linear layout, which then puts the different text input
layouts which have an added text.
So we're three of those, right?
We've used text input layouts before.
So it's basically always the structure of text input layout and then you have the actual added text
inside of that, and we have that three times.
OK, so one is for the password, one is for the user name and then the other one is for the email.
And finally, we have this little button here.
You can see a lot of details that we can edit here, as you can see in layout margin startup.
And so we have a bunch of settings that we have set up.
All right.
And at that point, to file a stunt.
OK, so now we can go over to this activity and finally do some action.
So what I'm going to set up here is an action bar function because I want to have this little icon here
at the top left.
This I can should bring us back to the activity before or two to sign up for this interactivity, basically.
Right.
So let's go ahead and create a new function here.
Private fund, set up action bar.
And what it's going to do is it's going to call this set support action bar, which is this default
function.
For Android and here you need to say which action bar you want to use.
So I want to use the toolbar sign up activity, OK, and where is it from?
Well, it's inside of our activity sign up.
You can see we have this toolbar that we created which has in text to you inside of it.
So basically, it's this one here.
And I want to set that as our Support Action Bar.
And then we can go ahead and set the bar.
To be the support action bar and check if the action bar exists, so if it's not now, then I want to
go ahead and set some settings for this action by one is to set display home as an able to drill and
then action bar said home as up indicator, also as our outdoor drawable that.
And here it becomes interesting, so it's just as a little icon that I want to use, which is I see
like color back twenty four.
So this one doesn't exist yet.
So let's create it.
OK, so we can go ahead and create a new.
Fekter asset, which I'm going to call just like that, going to select the panic button looking one.
So the back arrow.
So you can decide which one or s or Arabic thing, I'm just going to go with this one Arabic or iOS.
And I'm going to give it this name that I have used, I see Black Color back 24 DPE.
Because if we look at it.
So here, sign up, I can see it's this icon, it's just like the little arrow.
And it's created in there.
All right, so now it exists and the error disappeared.
All right, and of course, we just need to call this function.
I'm just going to call it here, set up action bar now because this code is not really big.
You could of, of course, just created or added to code Indian create methods of this whole code.
But having an extra function is not going to be that much of a hassle.
Right.
OK, so that's all sign up activity and we, of course, need to get there.
Right.
So how do we get here?
Well, we get here from the interactivity.
So let's add the relevant code here.
And how do we do that?
Well, very simple.
We go ahead and add a.
So don't click listener to our pop and sign up, so here, set on Click Listener and what is the code
that we want to run here?
Well, we want to start an activity and we want to start an intent here, which is going to go from
this class to our.
Sign up activity class, but Java and here should be double Koula.
All right, that's important and.
And that should be pretty much it.
So at this point, we should be able to test it.
So when we click on the button, which is our button sign up button, which comes from our sign up activity
here.
And by the way, it's not this one.
So there we are.
So we are using the same name twice.
This is very tricky.
Let's go back to our interactivity.
So here, if I enter button sign up and I was already wondering so you can see we have two which have
the same ID button sign up and button sign up.
So one of them is inside of our sign up XML and the other one is in our interreg simul.
So maybe you want to change the names here.
So let's go to the.
Enteral Ximo actually, so here activity intro.
And let's rename the sign up button.
Because I don't like to have ideas which are non-unique.
So here we have the sign up, button, sign button, sign up intro, so I'm going to call it like I
know we need to make sure that in the interactivity we also make this change.
So sign up intro's.
I don't click listener.
And by the way, while we're at it, why don't we do the same thing for the other button?
So for our button to sign in, let's call this one sign in intro.
OK, so it's also an active activity on the score intro, but I just think it's better to have really
unique names because you might guessed it that in the next video or in the next few videos, we, of
course, also going to have a sign in activity.
OK, so at this point, of course, there are many different solutions to this.
Right.
So one of them is the one that we have here where you come to this screen and you can either sign in
or sign up or you could directly go to this sign up screen or to the screen, and then you would have
a little button here at the bottom saying, do you want to sign in instead or something like that?
And it's just changing the UI.
So it's one activity, but it's changing the UI.
So this really depends on what you want to do.
So both ways are fine.
I think the second one is probably going to be a little quicker, but in most cases you should only
sign up or sign in once and then you will be signed in for a pretty long time usually, I guess, or
at least that's going to be the design that we want to have.
All right, so now let's test it, because we have prepared everything so far, I'd say we are starting
to activity when we click on the button sign up intro.
And that, of course, was the prepared project.
So not the one that we just built.
So let's check it out with our own project.
All right, so that we are proud to manage, then sign up and we get to our sign up activity and one
thing is missing.
You can see we still see the bar here at the top.
I don't like that.
So let's get rid of that.
And in order to achieve that, we, of course, need to add those when those red flags in our sign up
activity as well.
So in uncreate, let's just add those lines here, said flags like full screen and then let's run the
application once again.
All right.
So Projet Manaj.
Sign up.
And beautiful.
All right, so that button doesn't seem to do anything yet.
And in order to add that, we need to go to our set up action bar and add one more line.
So here it's going to be toolbar.
Underscore sign up activity, said navigation.
One click listener and here we're just going to do the same thing as if we had pressed the up and so
on back pressed.
All right, so I was just going to be this year on back.
That's right again.
OK, so Prosumer Nash, sign up and Temperton, perfect.
All right, so I'd say let's go over to the next video where we're going to prepare to sign in or to
sign in activity.
So I'll see you there.