[移动开发]Flutter使用路由

Flutter使用路由

1、意义

在用flutter开始写项目时，因为此项目中有着许许多多的页面，需要去进行跳转，从此界面跳转到另一个界面，此时就可以开始使用路由了。

2、使用方法

1、先去声明

在pubspec.yaml中引入fluro，我的版本是1.7.7

2、main中去使用

void main()async {
  FluroRouter router = FluroRouter();
  Routes.configureRoutes(router);
  Application.router = router;
  initializeDateFormatting().then((_) => runApp(MyApp()));
  //路由跳转
}

这个时候中的router中创建了一个application的文件

import 'package:fluro/fluro.dart';

class Application{
  static FluroRouter router;
}

3、其他文件去调用

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-t7c76QF9-1626250936537)(/Users/wuzhangxiao/Library/Application Support/typora-user-images/image-20210714155703526.png)]

在创建的NavigatorUtil中，都是进行到此界面

样例

//跳转到实验界面
static void goExperimentTabs(BuildContext context) {
  Application.router.navigateTo(context, Routes.experimenthome,
      transition: TransitionType.inFromRight);
}

这个之中还声明了进入到此界面后，是怎么进入的。

router_handlers文件是：此声明是什么界面，进入到什么界面。

样例

//登录
var loginHandler = new Handler(
    handlerFunc: (BuildContext context, Map<String, List<String>> params) {
  return new LoginPage();
});

这个是主动输出一个界面的布局。

在routes中

样例

static String getVideo = "/getVideo";
static String getSelectPlate ="/getSelectPlate";//选择板块
static void configureRoutes(FluroRouter router) {
  router.notFoundHandler = new Handler(
      handlerFunc: (BuildContext context, Map<String, List<String>> params) {
        print("ROUTE WAS NOT FOUND  !!!!");
        print('找不到路由,404');
      });


  /// 第一个参数是路由地址，第二个参数是页面跳转和传参，第三个参数是默认的转场动画
  router.define(login, handler: loginHandler);
  router.define(root, handler: homeHandler);
  router.define(home, handler: homeHandler);

三、项目中调用方法

在这个界面我要开始去进行跳转，这个时候就可以开始去调用我们的路由，跳转到我们所需要的界面。

Navigator.push(
    context,
    MaterialPageRoute(
        builder: (context) => UserSelectPlatPage()));