Guillermo García

Snippets para cambiar de pantalla

by

Cuando queremos cambiar de pantalla en Flutter usamos Navigator. Esto es algo muy común y cuando necesito poner el mismo código una y otra vez, me gusta tener un lugar de donde poder «copiarlo», así que estoy creando este post simplemente para eso, para saber que aquí puedo encontrar ese par de snippets que necesito cada dos por tres. Este post es para mí, pero si a le sirve a alguien más, pues mejor que mejor, para eso está internet.

Aclarar que normalmente utilizo las métodos con named para hacer los cambios de páginas, me ayuda a estructurar mis pantallas y lo recomiendo mucho, por eso sólo vais a ver este tipo de llamadas. Estos métodos asocian cada una de las pantallas con una ruta que será un script para identificar a cada una de ellas. Yo le pongo a cada pantalla una variable estática con su correspondiente variable estática para tener el valor en un solo lugar, por eso en los snippets no veréis strings con las rutas, sino llamadas a estas variables estáticas.

Por ejemplo utilizaré en los snippets una pantalla imaginaria llamada «SampleScreen», que podría tener el siguiente código:



1
2
3
4
class SampleScreen extends StatelessWidget {

  static const routeName = '/sample_screen';

  ...

}

Dicho esto, ahí van los snippets. Si voy necesitanto más iré complentando el post en un futuro.

Abrir una nueva pantalla



1
Navigator.pushNamed(context, SampleScreen.routeName);

Abrir una nueva pantalla enviando un argumento

Podemos enviar cualquier tipo de objeto como argumento a la pantalla destino. Por ejemplo podríamos enviar un string de la siguiente manera:



1
2
String sampleArgument = "sampleString";

Navigator.pushNamed(context, SampleScreen.routeName,arguments: sampleArgument);

Podremos recuperar este argumento en la pantalla destino dentro del método build:



1
2
3
4
5
@override

Widget build(BuildContext context) {

  String sampleArgument = ModalRoute.of(context).settings.arguments;

  ...

}

Volver a la página anterior



1
Navigator.pop(context);

Volver a una pantalla reiniciando la pila para que no se pueda volver atrás



1
Navigator.of(context).pushNamedAndRemoveUntil(SampleScreen.routeName,(Route<dynamic> route) => false);