Hello, in this video, I am going to show you how to navigate to a new screen and back. So basically, navigation, we've got this one page right here, every page, if I click it doesn't do anything but we want this to go to a cover page to implement this. It's actually really simple. Now what we've got here which is in a paid when he's creating new work, so what we'll do is we are on the second page, and we'll say we need to explain status stateless widget in a separate video only describe the difference between a stateless widget and a stateful widget. So stay tuned for that. And then in here, need to have not covariant overload overload.

We have to override the widget builder context basically this one it auto filled it out for me which is fantastic and you probably want to build it in a similar fashion to this you can build out you want honestly if you keep in a similar fashion you just need that the design the flow this know the layout has a very similar feel. So I'm gonna pause the flow and I'm going to print out fine here so I'm gonna pull title and this is another Gordon center and then I love it show. A poorer number raise what And here is where we'll navigate so far. So this is where we will navigate back to the first page or to the child here. Go back oopsy Daisy, this needs to be inside the quarter. There we go.

So if I say that and clicking it doesn't do anything, because when we have this unpressed event, this is where we need to implement the code to essentially go to the next page. So the way you do this is the core novel. gave out the dot push. So we have a push and pop system. So it has a stack of pages or views or whatever it is to push on to the next one. The top most one is the one that you currently see in Chrome interact with pop, it removes them, we're going to cover that in a second.

So dot push context. Actually, sorry, this is a method so we just do context. And then next we need to essentially specify the next page and you do that by doing material page route. And then you put the build up. And for this context, the arrow operator for this is going to be second page. Open brackets, semi colon.

Yet you need another semi colon The neat one here, put in the wrong place, put reload. And now if I click it, as you can see, it goes to the next page, and it automatically puts a back arrow. So if I click that, as you can see, swipe up and down. So he provides a little nice, cool built in and he made sure so we can do that. So that's just built in, we haven't implemented this button. So let's implement this one to do this is extremely simple.

We want to have a manual event it could be a button or it could be something else. Something else is triggered and, you know, certain condition is met, he could go back to the previous page to do they really simple. You just put navigator dot pop context and whatever is below it in the stack, you'll go back to that. So if I click, go back, as you can see the go back button works So that's how you navigate to a page back from a page and you can create as many of these as you want. And in the next video, I'm going to show you how to actually separate this into a separate file. Because as you can imagine, this could get a P. That's it.

If you have any questions, feel free to pop me a message. And as usual, I look forward to seeing you in the next video.