Hello guys.
Welcome to the video.
In this one I'm going to show you how to switch between different sets of menu.
As example.
We're going to make a skin selection UI that we're going to use to.
Uh, select different skins on the character.
And in this video we're just going to make example of a UI.
And we're going to make functionality so we can switch between these UIs.
Okay.
So what do we need here?
I think we need some sort of a parent first.
So let's make a parent for this new game button is going to be um main menu UI.
Then I want to duplicate this and I'm going to name this as a.
Skin selection UI.
All right, now let me switch off the main menu.
And on the skin selection we're going to need.
Four buttons.
So one of them going to be let me focus on this.
One of them going to be select or by I'm going to call it select.
For now this will have text of a select button.
Now, we also supposed to be able to go back to the main menu if we decide not to select a skin or for
any other reason.
Maybe you clicked new game and you want to continue the game, so you have to go back.
But that we're going to duplicate the select button and call it back.
And here we're just going to type back.
Very nice.
Now let's take this button back.
Move it below.
And I guess somehow we can.
Managed to place them together?
I'm not sure.
Let me see.
What if we.
Reduce the size of a button to something like this.
And let's place it lower somewhere here, and I'm going to duplicate it and bring it down and type here
back.
There may be improvements later on.
As of now, I think this is good enough because we just need to set up the functionality and final look
can always be polished later.
Uh, just let me take the text box and stretch it like so for this one as well.
Something like this will do.
Okay.
Very nice.
Now let's duplicate again this button.
But this one going to be next screen.
And in the text of this button, we're going to have only the arrow like that.
I'm going to make this button smaller to something like this.
Yeah, I think I like it.
Then I'm going to duplicate this button and name it as previous scheme.
And on this button the arrow will show to the left.
Nice.
Now let's take these two buttons next skin and previous skin.
And set position and pivot point in the center.
Very good.
Now we just want to take this and move it a bit to the right.
And take previous skin and move it a bit to the left.
Something like this will work, I guess.
Yeah, I think I like it.
All right.
Very well.
Also, I forgot to do something important and.
Yeah, man, you will kill me.
We need to select the parent and stretch it to the entire screen.
Let's do it.
Okay.
Oh, it's not that bad, actually, because sometimes you do it and then all elements go into wrong
places and you need to arrange them again.
But this is actually not that bad.
We can just take these two and move them down a bit.
All right I like it.
So now we have skin selection UI and we have main menu UI.
That I need to stretch as well.
And somehow we need to disable all of the UI elements and enable UI elements that we want to see.
Okay, how can we do this?
We're going to go to UI main menu.
And, uh, I'm going to make a serialize field, private Gameobjects array, and I'm going to call it
UI elements.
All right then we're going to need serialize field private GameObject.
Actually, we don't need anything else on the variables.
We only need the method.
We're going to go here.
And we're going to make a public void switch UI.
And here we're going to pass GameObject UI to uh enable.
All right.
Then inside of this switch UI, we're going to run for loop that will disable all of the elements in
this array over here.
So we're going to do not for loop actually let's use for each.
This will be better for us.
So we're going to do.
UI here and then UI set active false.
And after we switched off all of the elements, we're going to take element.
We want to switch on and set UI element.
Set active.
What's up man?
Set.
Active.
Oh, I'm calling the wrong variable.
UI to enable set active.
True.
That's all what we need in the script.
Now we can go back.
And.
I'm going to take these two elements and drag them to UI elements array like so.
So we have array of the UI elements in the main menu.
I'm going to disable this one for now.
Then on the main menu on a new game button, instead of starting new game, I'm going to call UI main
menu switch UI.
And here we need to pass game object that we want to enable.
And I'm going to pass Skin Selection UI.
All right.
Now let's go to the back button over here.
And I'm going to change it from new game to switch UI.
And I'm going to drag a main menu UI over here.
All right.
Now let's go to game mode.
And we have new game.
I'm going to click new game.
We switched to a different UI.
And here we can select a skin and then we can go back if we want.
Or we can go to New game.
Click select and game will begin with the skin we selected.
And very nice.
And this functionality can be used basically to switch between any menu we have in the game.
Any menu.
Yeah.
Um.
Let's make one more UI element.
I think I'm going to copy the skin selection because it has the back button.
So I'm going to copy skin selection.
This will be disabled and this will be enabled.
And I'm going to call it settings UI.
So on the settings we have back button, um select button.
We don't need that.
And these two we don't need that.
So now we have settings UI that we need to set up.
We're going to do it later.
Not now.
And something else here.
Yeah we need um level selection UI.
And this will be responsible for level selection later on as well.
Now let's drag them to UI elements level selection.
We're going to disable these enable main menu.
And this is good enough.
Let's save the project.
And let's go to next video.
We're going to make skin Selection UI okay.