We're calling him screens and TV.

So with that, let's get into it.

So the first thing we need to do is important.

The screen manager.

So from key v dot u i x dot screen manager We want to import screen Manager.

We also want to import screen because we're gonna be using that as well.

So now coming on down here rather than epic app just simply returning Connect Page Um, what we want to do is be able to switch screens between, um between pages.

So in theory, you could go from page to page to page in a very linear manner.

But chances are that's not really what you want to do.

Um, so instead, really, what you want to be able to do is manage your screens with the screen manager.

So So what we're gonna do here is under in this build method, we're not gonna return connect page anymore.

And instead we're gonna build this like screen manager?

I think so.

First of all, self, not self.

Don't screen.

Underscore Manager is gonna be a screen manager.

Object.

And then what we want to do is add our pages or screens to the screen manager.

So what we're gonna say is self not connect.

Paige is going to be a connect page object, And then we're gonna say is screen equals screen and we're gonna give this screens name connect.

So now any time you want a reference this screen, we're just gonna reference connect the string.

So then we're gonna say screen dot ad underscore widget and then self dot connect page.

And then finally, we're gonna self dot screen manager don't add widgets that screen.

Cool.

So this is what you're gonna do every time you want to add a screen that you want to be able to reference by the strength.

So now we're gonna do is the same thing, but we want some sort of next page.

I'm gonna call this the info page.

So self dot info page is equal to an info page object which doesn't yet exist, But we will create one.

Um, there was a screen equals screen on.

In this case, the name will be info screen dot ad widget self dot Um, connect page info page and then self, don't screen manager dot ad widgets screen.

Cool.

So now we've got our two pages, so you should be able to notice the pattern here between these two things.

Pretty simple.

So now we can add, you know, an infinite number of pages we can call upon those pages when someone say, like, clicks a button or something like that So you could have some sort of naff bar in your app.

It can definitely be pretty darn awesome now for us.

We don't even have an info page yet, so we should do that also, uh, rather remember, before we returned, we have to return something, right?

We return the thing that we want the apt to run right, because this is the build method.

So in this case, we actually are going to return self dot screen manager.

Cool.

All right, so now what we need to dio is like our connect.

Paige, we need to create an info page.

So coming down here, I'm just gonna throw it right here.

I'm gonna call this class info page.

It is like the other, uh, pressure.

It's a capital.

Yeah, it's going to inherit from Gridley up also in the innit method.

Um, same thing as before.

So, self quark eggs, Um, and then we're basically just gonna run.

So it's this here, right?

So actually, just kind of copy come down here.

Not too far pasta and rather than self that calls us to I'm actually gonna say it's one column now and now we're gonna do is self dot message.

And this is like a dynamic message is not a message.

What we're just gonna set.

And apparently, I guess if you use the key V style thing or the TV docks, I don't know.

You're supposed to call these things, but the dot k v files.

They're kind like CSS for h e mail or something like that.

Um, no real intention to cover it here.

I did cover in the older Siri's.

I just I just hate splitting out like that.

I'm assuming if you had like, a huge enough app, it would become really useful.

Tohave it like split away like logic in one area and design and another um, but I just I just don't like it, but just understand that does exist.

So check that out.

It's just the dot k V or K V files.

I forget we're supposed to call them, but anyway, if you use that, apparently this little thing doesn't happen.

But anyway, we'll let me type it out first, and then we'll talk about it.

So the message will be a label object and the horizontal line is going to be sent her.

And then we also wanted to the same thing with vertical line, which in this case, is actually middle.

Imagine a world where we just use the same terminology for for the same thing.

Anyway, fun size 30 for 39 doesn't really matter anyway.

That's our message, right?

It's a label, but it doesn't currently have anything.

We need to be ableto update this label as needed.

So we're gonna first say, you know, trying to connect.

But then maybe if there's an error or something, we wanna update it with whatever the air is and so on.

So what we need to dio is bind a method to it.

So we're gonna say self dot message dot bind and we're gonna stay with is equal to self dot update, update, update, text, width, And then we're gonna say self dot ad widget self dot message.

Then what we're gonna say is in a new method, what?

We need two things we need the update text with.

And then we need, um, the actual message itself.

So the issue is, if you just have So you have a label and then you're gonna add stuff to that label that in theory could change the size of things and all that, and so you have to just keep updating it.

Like I said, if you have the K V style files or whatever, apparently that doesn't happen.

Um, like, you don't actually have to, like, resize it yourself or like, listen for the re size.

Um, so it's probably just because things were called in a different order.

When you're using those files, I really don't know.

Anyway, define updates underscore info, and this will be self message.

We're gonna update the message for this label.

So we're going to say, um, self dot message dot text equals that message, so that should just update it for us and then finally, we need to do the update text with.

So we're gonna say to find update text with and that self and then anything else, but we just don't care.

Um, and in this case, we're just going to say self dot message dot text underscore.

Size equals self dot message dot with times 0.9 and then we're not worried about, um, the wife.

So now that should be good message with us.

So we just want that to take up 90% basically off this page, like it's just like anything.

If it goes all the way to the edge is it just looks kind of goofy.

Okay, cool.

So we've got our two pages.

We've got him connected to the screen manager.

Okay?

Now all we need to do is figure out How do we like what do you want to have called these changes?

Right?

So you might have a knave bar something, but in this case, it's just when the user hits join, right?

So when they hit joined, we want to change the page or change the screen to this info page that says, Hey, we're connecting, or we got an error whatever.

Okay, so in this case, that's what we want to do.

So what we want to do now is go to our join, but in which is in our connect page, and, um cool.

So what we want toe happen when someone clicks that joint button is, first of all, we're gonna take this print statement.

I'm just going to get rid of it.

But I'm gonna first copy what was inside of it, and I'm going to say info equals that bit of information they were going to say.

Um, Well, first, what we have to do is so we we wanna be able to reference in the instance that is running right now.

So in order for us to do that, we're gonna say chat app equals epic app.

And then, um, we're going to say, uh, chat app dot run.

But now we can reference things with chat app.

So we're gonna come back up to the joint button and we're going to say chat app dot info page, don't update info with our info and then, um and so, like, that'll go to our info page.

Where is info page updates?

The info sets the message text to whatever that message is that we pass, which is the info but a boom bada bing.

We get over this label, which just so happens to also be listener for the re size after we've updated it to set to 90% of the with crazy.

Okay, so we've updated that page, then info is updated.

We just can't see that screen yet.

So what we need to do is bring that screen to the forefront.

So we're gonna dio is it shacked ap dot screen manager dot current equals boom info.

That's it.

So any time you have some sort of thing right in this case are but in.

So when someone on presses that joined button that we created, it runs in this method, and if all you wanted to do was change the page Boom.

This is the only line that you would need to run.

But I'm sorry.

This is the only life that you need to run.

But we wanted to update that info, whatever info was on an info page.

So we ran this first and did some other stuff save some other stuff.

Um, but basically, to change the screen one line of code right there.

Cool.

So, honestly, that should be everything we need up to this point change screen.

So let's test it out.

Was running.

Okay, here we go.

It's not gonna be able to connect, but at least tell us.

Cool.

So it says, attempting to join, um, that server or that I p that port as username.

Cool.

And it changed the screen.

Awesome.

Very good.

Very good.

Okay, so now what we want to do is connect all this to our actual socket code and start building that page.

Now, the way that we're gonna do that, if you go to the text based version of this tutorial, all post pry in both versions, this version and the next version the socket server dot pie and then the clients socket are basically socket client dot pie files.

I'm not gonna go over those at all.

I feel like, uh, like, there's nothing new in there.

The server is the server code is exactly what we did in the sockets tutorial.

And then the client dot pi code is, like, just slightly modified, so there's really nothing new there.

If you want to learn about that stuff at the end of this video, I strongly suggest Go to the socket Siri's.

It's already released, so you can go through those.

If you want to learn more about those, uh, otherwise, I guess just stay tuned to the next tutorials.

Quick, quick shoutout to my recent channel members, Tej and visit Ranjit Kumar A thank you guys very much for your support.

You guys are incredible.

In the next video, we're gonna be talking about scheduling tasks.

Um, so setting up things like functions and methods and stuff like that to run on some sort of schedule using the key V clock.

Um, otherwise, uh, that's it for now.

Questions, comments, concerns, love notes, whatever favoritism below.

Otherwise, I'm gonna see you guys in the next video.