002.2 flutter页面路由【入门级】
2020-03-22 本文已影响0人
码农二哥
简单的Navigator.push
假设我们app长这个样子
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
// This is the theme of your application.
primarySwatch: Colors.blue,
),
// demo app 一般都直接用home来指定初始页面,当然也可以使用NamedRoute
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
- push like this:
RaisedButton(
child: Text('open ListPage'),
onPressed: () {
Navigator.push(context, MaterialPageRoute(
builder: (context) => ListPage()
));
},
),
- pop like this:
Scaffold(
appBar: AppBar(title: Text('ListPage'),),
body: Center(
child: RaisedButton(
child: Text('back'),
onPressed: () {
Navigator.pop(context);
},
),
),
);
Navigate with named routes
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
// This is the theme of your application.
primarySwatch: Colors.blue,
),
// home: MyHomePage(title: 'Flutter Demo Home Page'),
initialRoute: '/',
routes: {
'/': (context) => MyHomePage(title: 'Flutter Demo Home Page'),
'/ListPage': (context) => ListPage(),
'/DetailPage': (context) => DetailPage(),//敲出来之后,会自动添加import,不需要手动import
},
);
}
}
- Navigator.pushNamed
RaisedButton(
child: Text('open detail page'),
onPressed: () {
Navigator.pushNamed(context, '/DetailPage');
},
),
- pop和之前还是一样的。