 All right welcome back. So in this lecture we are actually going to get the screen switching working. Now that we have our animations, our code all working, we have the screen set up, we can actually start to see our UI system in action. We can actually start to go back and forth between screens. Everything's going to fade in and out. All right so let's jump over to Unity and get going. All right so here's where we left off in the last lecture. So what I want to do is just test out our screen switching and see what happens. Okay so in order to make this work whenever we click this button so let me actually navigate to the button here. So that's in the no account panel and we should actually rename that so I'm going to call this the signup button just so it's clear and I hate it when I do that. So super nitpicky but I'm going to do that anyways. Anyways so now we have the button selected over here and you'll notice that we have an event, a Unity event, just like the events that we've added to all of our scripts. So what we can do with these Unity events is we can add a new listener. Okay so this whatever we assign to this object here we'll be listening for this particular on click event. So when we click this button what we can do is now we can drag the UI group which has the UI system on it. Select the UI system switch screens method and you'll notice now we have the option to sign a screen that we want to switch to and that's because we if we go back to our code we put in an argument for our switch screen method so it's expecting a screen. So let's go back to Unity over here. Excuse me and what we're going to do is we're going to drag in the register screen like so. So with that we should be able to switch screens. Let's actually take a look and see what happens. So I'm going to hit play and notice that we get the fade in nice so we fade in but our screen is off that's weird we can't see our screen and that's because our animator for our login screen is set to idle. We never actually tell on start. We never tell the UI system to start whatever screen we want to start up first so basically these screens are just waiting for someone to tell them to show them if that makes any sense. So we actually need to add one more thing to our UI system so let's go back to our UI system over here. We actually need so a new header so I'm going to create a new header here called main properties. All right what we need is a way to say hey this is the start screen. So start this particular screen when the UI system starts so I need to say public IP UI screen okay we'll call this M start screen. All right so now what we can do is we can say okay when the UI system starts what screen do we want to launch first which screen do we want to take from idle to show first and that is going to be the login screen in this case but you can see how modular that is now we can set it to whatever I could set it to the register screen if I wanted to but the login screen is the first in this particular UI flow. Okay so now what we need to do is go back to our script over here so when the the game starts or when the the app starts or this UI system starts when you say if M start screen okay we'll do this before the fade in because we want the the screen to be on or fading in also or doing whatever animation before we fade in so it's a nice smooth transition okay we're going to say switch screen so we can use that method again and we can say M start screen simple as that we didn't really have to do a lot at all okay so now let's see if that actually worked for us so I'm going to go to scene here and we can actually watch it watch the animator as well so I'm going to leave these both up so I have the game view and the animator running all right so there's one more thing that we actually have to do here so we switch screens we started it but we're never telling the screens to start because we never uncommented our code okay so we just need to do that and there is no close on the screen it's actually closed screen okay so let's go back to Unity see if that completes everything so I'm going to hit play and oh now we have another issue okay so this is caused because these animations are set to loop and I don't want that so the show doesn't need to loop and the hide doesn't need to loop okay so now that we've turned those off let's hit play again bam now we have a nice smooth transition inwards so we fade in and now we're waiting to switch to the screen so let's go back to that button okay so again let's do a quick review so when we click this sign up button right here okay what we want to do is want to switch to the register screen all right so let's let's see if that all works because we have it all hooked up okay so let's hit play we'll fade in now we're on show and now I'm going to hit the sign up button and we'll take a look at the register and that is never actually getting called so the reason for that is because the register screen is actually off when this whole thing starts all right so it doesn't give it enough time for the animator to initialize you'll notice now if I were to turn this screen on okay and we start this we'll get that same effect where we go to login screen first right then we hit sign up and now we actually have the sign up well that's cool so what we need to do is we need to make sure that all the screens are on when we start so last thing to fix in our UI system over here okay so what I want to do is in start over here what we want to do is initialize all the screen so we should just make another method for that so I'm going to call this initialize screens simple as that makes it nice and clear all right so I'm going to save that and let's just put that well let's just put it at the bottom how about that for now it's not really super important right now all right so we'll put that at the bottom so then we'll say for each var screen in screens excuse me like so we'll just say screen dot game object dot set active to true boom so now it'll turn all the screens on and then we start the whole process okay so let's check that out now so to test this I'm gonna I have the register screen turned off so let's see if that worked for us boom boom there we go so now we can we can leave screens on and off and it doesn't affect it so now we have the basic screen switching set up so for the back button we can actually set up the previous method so we can utilize this whole go to previous screen method right here okay so if we go to the register screen and go to the back button on when we click that so in it's on a click event I want to tell the UI system to switch the screen to the login screen or actually we can just go to previous screen because when we switch screens we are automatically setting the previous screen so now we should have the login screen as the previous screen okay so let's test this all out again there we go we get log up login sorry and then sign up but we want to go back and we go back to the login there we go we can go back to sign up there we go perfect all right so now we have a modular UI system setup so you can literally reuse this amongst all your projects and if you wanted to add anything else on to it you can easily extend all of these particular assets so for animations you create an override for code you would just extend the UI screen okay you don't really need to do anything with the UI system unless you really wanted to you extend those obviously you make your own art so what we have now is a fully reusable UI system inside of Unity 2017