Navegar con rutas

Aunque ya hemos visto como ir de una pantalla a otra (Navegar entre dos pantallas), en ocasiones es más práctico y eficiente (por no duplicar código, especialmente si hay que navegar a la misma pantalla desde muchas partes de la aplicación) definir previamente las posibles rutas (sus nombres y destinos).

Para aplicar este método al código de Navegar entre dos pantallas, en MaterialApp establecemos dos nuevas propiedades: initialRoute y routes de esta manera (también quitamos la propiedad home):

void main() {
  runApp(MaterialApp(
    title: 'Navigation Basics',
    // home: Home(),
    initialRoute: '/',
    routes: {
      '/': (context) => Home(),
      '/second': (context) => PantallaDos(),
    },
  ));
}

Y ahora cambiamos la función onPressed de la pantalla Home para dejarla así:

onPressed: () {
	/* Navigator.push(
    	context,
        MaterialPageRoute(builder: (context) => PantallaDos()),
    ); */
    Navigator.pushNamed(context, '/second');
},

En ocasiones, para mantener las cosas ordenadas, se puede usar la propiedad onGenerateRoute de MaterialApp para que una función devuelva una determinada ruta, y usualmente las rutas se separan en una clase en un archivo independiente (por ejemplo, router.dart).