Named Routes in flutter for navigating to another screen

To navigate from one screen to another we can either use MaterialPageRoute or pushNamed which uses Named routes.

In Named routes you give each new screen a Name which is a string and thus it is very useful for a very complex app. You just need to provide that string name to your Navigator

First we need to Create our various routes. In MaterialApp widget there is a property called routes which takes a map of key:value. The key is a stirng and value is a callback which returns the object of the New screen.

routes: {
 ‘/’: (context) => FirstScreen(),
 ‘/second’: (context) => SecondScreen(),
 },

We use the Navigator.pushNamed() method to navigate to the new screen on some event like onPressed. This method takes context as first argument and the second argument is a String which is the key of routes map that we defined.

onPressed: () {
 // Navigate to the second screen using a named route.
 Navigator.pushNamed(context, ‘/second’);
}