Hey guys, welcome to protocoder's point
So in this flutter tutorial, we gonna implement root management using flutter gettx library
So let's begin. So as you can see, I have created a simple UI design
This is simple login and registration screen. So this is the login screen
And here you can see for new user, there is a button or text
When you press this, it is login screen. So this navigation has been made by using normal flutter root management
So in this video tutorial, we gonna make use of gettx root management to make the navigation
So if you want this UI design, then you can visit our website www.protocoder'spoint.com
The URL will be in the description. From here you can check what all I have done
All the steps are there for integration. Everything is there. So if you want to directly download this project, you can get it from GitHub
The link is in the description. So this is the welcome page
So as you can see, I am making use of normal navigator to go to second page
Means from welcome page to registration page or login page. I am making use of navigator, flutter navigator to travel
So as you know that in this video tutorial, we are making use of gettx library to achieve the same
So first of all, what you need to do is you need to add a gettx package
So come to pubspec.yaml file and under dependency, after two words, as you can see after two words are there
after two words you need to add this gettx package. After adding this, just hit this button
I have already done that. So now let's go to home page for the integration by using gettx
So first of all, you need to import this gettx project
You need to import this gettx. Sorry, I forgot one thing
You need to go to main page first. First of all, you need to go to main.dat page and over here instead of simple material app
you need to add gettx material app. This comes from the gettx package
So you need to import it. Okay, we are done
After that, we will create some routes over here. For travelling to login page and registration page
There are only two pages for this project. Okay. So here, create route. Okay
And the route first thing is, we will go to home page
The route, the welcome page. That is the welcome page. Okay, so as you can see the home page is welcome page
Over here, just add welcome page and then create one more route
That is login page. And then just pass the context
You need to import this page. And third one is the register page
We will do it as reg and pass the context
Okay, so as you can see we have created all the routes to travel
Okay, so after that we will make use of initial route. Initial route will be the route node
This one. This route. Okay, so whenever you use this initial route
there is no need to add this home. Just remove it. So, just restart the app now
Okay, so it's working. The initial route is now working. So, let's go into welcome page
Welcome page, as you can see, there is a login button. This is just for Google and Facebook
This is just for UI design for this tutorial. Okay, there is a login button and there is a registration text
So, when this login button is pressed, it will go to login screen
And when registration button is pressed, then it will go to registration page
Okay, so let's find where this code is. Okay, so the code is over here
I made use of container to build this login button. Okay. So, instead of this power tab navigator
we'll just remove it and we will make use of the text properties
That is, go to page
So, page we need to go is the route, this one. Just copy and just paste
Okay, so as you can see, this will not work because if you are making use of two
then you need to specify the exact page
Like this. Okay, so now this will work. Okay, so this is the first feature properties of getTextToName, page route management
Okay, so this you can achieve by making use of name also
means go to name, this is the name, that is get.toName. Okay, here you can specify the name of the route that you have specified over here
We'll just comment this out. Okay, so this will be shown
So, now we are in login screen. It will perform the same
Okay, so as you can see, when I press the back button
it will again take us to the welcome page. So, this we don't want
At that time, what we can make use of is get.of
This you can make use when you want to go direct page
you want to jump to login page directly without any route specification
Okay, so what this command will do is whenever the button is being pressed
this will remove the welcome page and this will navigate to login page
As you can see, so now we are on login page and whenever user press back button
it will go back to welcome page. So, I will just restart this app
So, I'm using this off, means this will off the previous page and this will navigate to a new page
So, I am pressing over here. So, now we are in login page and whenever I press back button
the app will get closed. So, as you can see, this happens
Okay, so this you can approve by making use of name also
For that, you can make use of name. And you can specify the name of the page you have specified in the route page
We are now login page and back press, we are back to our mobile app
These are the three functions that we can use to navigate. Okay, and then there are many other properties that you can work with Google
the text management, so I am now in the bottom navigation bar, this one
there is a text widget and there is a registration text. Whenever it is being pressed, it will go to a registration page
So, on tap, that will navigate to registration page. Okay, so as I have told you all these properties, there are many other properties
such as off, all. What this will do is, this will remove all the previous visited page
and keep the registration page on the top
Okay, so this will remove all the previously visited pages and keep the registration page on the top
So, whenever the user is in registration page and when he takes back
the app will get shut down. Okay, and like this there are many other that you can use
that off, named. Named is used as you know whenever we need to use the route that we have specified
This one, registration, like this. Okay, this will remove all the previous and registration page will get opened
And there are many other, let me check. Get off, here you can see end, off and to name page
Of all name page, named until. You can specify until which page you need to off the navigation
These are the properties. And there is one more, this is whenever there is a dialogue buffer
or anything that is being opened. So, if you want to close it, you can directly make use of this
Get.back, this will automatically remove this dialogue box. Means, if any, it is there. Okay
Okay, this was a very short video on GetX route management. Okay, so that's all for this video tutorial
Hope you got the concept of GetX. Please do subscribe to AutoCoder's point