Flutter命名路由

命名路由需要在根组件定义Routes

main.dart

import 'package:flutter/material.dart';
import 'package:untitled1/Pages/Tabs.dart';
import 'package:untitled1/Pages/SearchPage.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      home: Tabs(),
      routes: {
        '/Search':(context)=>SearchPage()
      },
      theme: ThemeData(primarySwatch: Colors.cyan),
    );
  }
}

然后使用Navigator.pushNamed(context, routeName)跳转

import 'package:flutter/material.dart';
import 'package:untitled1/Pages/SearchPage.dart';

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          RaisedButton(
            child: Text('跳转到搜索页面',style: TextStyle(
              color: Colors.white
            ),),
            onPressed: (){
              Navigator.pushNamed(context, '/Search');
           
            },
            color: Theme.of(context).accentColor,
            textTheme: ButtonTextTheme.primary,//文字主题
          )
        ],
      ),
    );
  }
}

命名路由传参

routes统一配置Routes.dart

import 'package:flutter/material.dart';
import 'package:untitled1/Pages/Tabs.dart';
import 'package:untitled1/Pages/SearchPage.dart';


final routes = {
  '/':(context,{arguments}) => Tabs(),
  '/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;
    }
  }
};

main.dart

import 'package:flutter/material.dart';
import 'package:untitled1/routes/Routes.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      //home: Tabs(),
      initialRoute: '/',//初始化的时候加载的路由
      //命名路由传参统一处理
      onGenerateRoute:onGenerateRoute,
      theme: ThemeData(primarySwatch: Colors.cyan),
    );
  }
}

在需要跳转的页面加上需要传递的参数arguments-----SearchPage.dart

import 'package:flutter/material.dart';

class SearchPage extends StatelessWidget {
  final arguments;

  SearchPage({this.arguments});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(this.arguments!=null?arguments['title']:'无参',style: TextStyle(
          color: Colors.amber
        ),),
      ),
      body: Text('搜索页面'),
    );
  }
}

最后Navigator.pushNamed跳转

Home.dart

import 'package:flutter/material.dart';
import 'package:untitled1/Pages/SearchPage.dart';

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          RaisedButton(
            child: Text('跳转到搜索页面',style: TextStyle(
              color: Colors.white
            ),),
            onPressed: (){
              Navigator.pushNamed(context, '/Search',arguments: {
                "title":'传递参数'
              });
            },
            color: Theme.of(context).accentColor,
            textTheme: ButtonTextTheme.primary,//文字主题
          )
        ],
      ),
    );
  }
}