Flutter使用fluro管理路由

1,366 阅读1分钟

使用fluro管理路由

项目路由管理有点乱,体验一下fluro来管理路由

下载

dependencies:
  fluro: "^1.6.2"

配置

1、新建文件 lib/pages/routers/router_handler.dart

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

import 'package:fluro/fluro.dart';

import 'package:demo/pages/home/home.dart';
import 'package:demo/pages/screenshot/screenshot.dart';

// 首页
var homeHandler = Handler(
  handlerFunc: (BuildContext context, Map<String, List<String>> params) {
    return AppPage();
  }
);

// 跳转的目标页面
var screenshotHandler = Handler(
  handlerFunc: (BuildContext context, Map<String, dynamic> params) {
    String userId = params['userId'];
    String userName = params['userName'];
    return Screenshot(userId: userId, userName: userName);
  }
);

2、新建文件 lib/pages/routers/routes.dart

import 'package:flutter/material.dart';

import 'package:fluro/fluro.dart';

import 'package:demo/routers/router_handler.dart';

class Routes {
  static Router router;

  static String root = '/';
  static String screenshot = "/screenshot";

  static void configureRouters(Router router) {
    // 未发现对应route
    router.notFoundHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) {
      print('route not found!');
      return;
    });

    router.define(root, handler: homeHandler);
    router.define(screenshot, handler: screenshotHandler);
  }


  // 解决fluro不支持中文
  static Future navigateTo(BuildContext context, String path, {Map<String, dynamic> params, TransitionType transition = TransitionType.native}) {
    String query =  "";
    if (params != null) {
      int index = 0;
      for (var key in params.keys) {
        var value = Uri.encodeComponent(params[key]);
        if (index == 0) {
          query = "?";
        } else {
          query = query + "\&";
        }
        query += "$key=$value";
        index++;
      }
    }

    path = path + query;
    return router.navigateTo(context, path, transition:transition);
  }

}

3、main.dart

import 'package:flutter/material.dart';

import 'package:fluro/fluro.dart';

import 'package:demo/routers/routes.dart';

void main() {
  final router = Router();
  Routes.configureRouters(router);
  Routes.router = router;

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      onGenerateRoute: Routes.router.generator,
      debugShowCheckedModeBanner: false,
      initialRoute: '/',
    );
  }
}

使用

onTap: () {
  String userId = 'token';
  String userName = 'wlgliu';
  Routes.navigateTo(context, Routes.screenshot, params: {
      'userId': userId,
      'userName': userName,
  }, transition: TransitionType.inFromLeft);
},