17flutter中的路由/命名路由/命名路由传值/无状态组件传值/有状态组件传值。
main.dart
import 'package:flutter/material.dart'; import 'package:flutter_demo/pages/Search.dart'; import 'routes/Routes.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { // TODO: implement build return MaterialApp( initialRoute: '/', onGenerateRoute: onGenerateRoute ); } }
Product.dart
import 'package:flutter/material.dart'; class ProductPage extends StatefulWidget { ProductPage({Key key}) : super(key: key); _ProductPageState createState() => _ProductPageState(); } class _ProductPageState extends State<ProductPage> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('商品页面'), ), body: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: <Widget>[ RaisedButton( child: Text('跳转到商品详情页面'), onPressed: () { Navigator.pushNamed(context, '/productinfo', arguments: {"pid":778899}); }, color: Theme.of(context).accentColor, textTheme: ButtonTextTheme.primary), ], )); } }
ProductInfo.dart
import 'package:flutter/material.dart'; class ProductInfoPage extends StatefulWidget { Map arguments; ProductInfoPage({Key key,this.arguments}) : super(key: key); _ProductInfoPageState createState() => _ProductInfoPageState(arguments:this.arguments); } class _ProductInfoPageState extends State<ProductInfoPage> { Map arguments; _ProductInfoPageState({this.arguments}); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('商品详情页面'), ), body: Text("这是一个商品详情页面pid=${arguments["pid"]}") ); } }
Routes.dart
import 'package:flutter/material.dart'; import '../pages/Product.dart'; import '../pages/ProductInfo.dart'; import '../pages/Form.dart'; import '../pages/Search.dart'; import '../pages/Tabs.dart'; final routes = { '/': (context) => Tabs(), '/form': (context) => FormPage(), '/product': (context) =>ProductPage(), '/productinfo': (context, {arguments}) =>ProductInfoPage(arguments: arguments), '/search': (context, {arguments}) => SearchPage(arguments: arguments) }; //固定写法: var onGenerateRoute = (RouteSettings settings) { //统一处理: final String name = settings.name; final Function pageContentBuilder = routes[name]; if (pageContentBuilder != null) { if (settings.arguments != null) { final Route route = MaterialPageRoute( builder: (context) => pageContentBuilder(context, arguments: settings.arguments)); return route; } else { final Route route = MaterialPageRoute(builder: (context) => pageContentBuilder(context)); return route; } } };
Home.dart
import 'package:flutter/material.dart'; class HomePage extends StatelessWidget { const HomePage({Key key}) : super(key: key); @override Widget build(BuildContext context) { return Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: <Widget>[ RaisedButton( child: Text('跳转到搜索页面'), onPressed: (){ Navigator.pushNamed(context,'/search',arguments: { "id":123 }); }, color: Theme.of(context).accentColor, textTheme: ButtonTextTheme.primary ), RaisedButton( child: Text('跳转到商品页面'), onPressed: (){ Navigator.pushNamed(context,'/product'); } ) ], ); } }