Flutter Navigation

Navigation in Flutter.

Navigating from one Flutter page to others and back

In this application we have three pages VsjOne, VsjTwo and VsjThree.

We begin by defining three routes in main itself.

void main() {
  runApp(MaterialApp(
    debugShowCheckedModeBanner: false,
    initialRoute: '/',
    routes: {
      '/': (context) => VsjOne(),
      '/second': (context) => VsjTwo(),
      '/three': (context) => VsjThree(),
    },
  ));
}

VsjOne is the default route and then we have two named routes second and three.

To move from one page to another we push the new route into the Navigator.

ElevatedButton(
    child: const
Text('Go to Vsj:2'),
onPressed: ()
{
    Navigator.pushNamed(context, '/second');
}),

To go back to the previous screen we have.

ElevatedButton(
                onPressed: () {
                  Navigator.pop(context);
                },
                child: const Text('Go back to VSJ:2'),
              ),

A go back option will come automatically when you move forward.