flutter路由导航配置

flutter路由分为Route 与 Navigator,具体说明官方文档都有

路由配置，设置默认跳转主页

1. 创建route文件，以及跳转的主页
2. 在main.dart文件下配置

import 'package:flutter/material.dart';
import 'routes/Routes.dart'; //路由文件地址

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      initialRoute: '/',     //初始化的时候加载的路由
      debugShowCheckedModeBanner:false,
      onGenerateRoute: onGenerateRoute
    );
  }
}

3. 配置routes.dart文件，下面文件固定格式使用即可，不需要更改 flutter2以上有一些改动，自带判定null，以下为flutter2以上配置

import 'package:flutter/material.dart';
import 'package:flutter_didi/pages/logins/RegistPage.dart';  //对应页面路径

var router = {//配置路由路径
  '/':(context) => RegistPage(),
  // '/contentPage':(context,{arguments})=>SeeImagesPage(item: arguments),  //跳转传值
};
//固定写法
var onGenerateRoute = (RouteSettings settings) {//onGenerateRoute配置
    //统一处理
  final String? name = settings.name;
  final Function pageContentBuilder = router[name] as Function;
  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;
    }
  }
};

以下为flutter2以前配置

//固定写法
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;
    }
  }
};

4. 添加默认主页，运行项目默认进入此页面

import 'package:flutter/material.dart';

class RegistPage extends StatefulWidget {
  RegistPage({Key? key}) : super(key: key);
  @override
  _RegistPageState createState() => _RegistPageState();
}
class _RegistPageState extends State<RegistPage> {
@override
void initState() { 
  super.initState();
}
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Container( 
        alignment: Alignment.center,
        child: Text('我是首页，我居中显示'),
      )
    );
  }
}

5. 执行flutter run

6. 到此路由配置就完成了、