Cambiar de vista/ventana en Flutter es muy sencillo, en Flutter se navega entre pantallas, usando un Navigator y Route, todo dentro de la misma Activity.
Un Route es una abstracción para un “screen” o “page” de una aplicación, y un Navigator es un widget que gestiona rutas. Un navigator puede hacer push y pop de routes para moverse de pantalla en pantalla. Los navegadores funcionan como una pila en la que puedes hacer push() a nuevas rutas hacia las que quieres navegar, y desde la que puedes hacer pop() a las rutas en las que quieres “volver atrás”.
Para cambiar de vista basta con crear un Route nuevo y agregarlo a la pila del Navigator:
Route route = MaterialPageRoute(builder: (context) => NuevoWidget()); Navigator.of(context).push(route);
Como ejemplo: crearemos un WidgetOrigen y WidgetDestino y un botón en cada uno, uno para abrir y otro para cerrar/volver al Widget Origen y nos quedará de la siguiente manera:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: WidgetOrigen(),
);
}
}
class WidgetOrigen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Widget Origen'),
),
body: Container(
padding: EdgeInsets.all(32.0),
child: Center(
child: RaisedButton(
child: Text("Ir al otro widget"),
onPressed: (){
Route route =MaterialPageRoute(builder: (bc) => WidgetDestino());
Navigator.of(context).push(route);
},
),
),
),
);
}
}
class WidgetDestino extends StatelessWidget {
final Widget child;
WidgetDestino({Key key, this.child}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Widget Destino'),
),
body: Container(
padding: EdgeInsets.all(32.0),
child: Center(
child: RaisedButton(
child: Text("Regresar"),
onPressed: (){
Navigator.of(context).pop();
},
),
),
),
);
}
}
