Flutter路由fluro使用和代码浅析

https://github.com/theyakka/fluro
特点：
1、路由导航实现简单
2、路由函数处理
3、匹配通配符参数
4、内置多种过渡动画，支持自定义过渡动画

demo：
https://github.com/anymyna/flutter-examples/work_from_home

使用步骤：

1、 添加依赖

dependencies:
  flutter:
  fluro: ^1.5.1 

2、 初始化

class MyApp extends StatefulWidget {


  MyApp()  {
    final router = new Router();
    Routes.configureRoutes(router);
    Application.router = router;
  }
  // This widget is the root of your application.
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _MyAppState();
  }
}

应用全局配置Router

class Application {
  static Router router;

}

3、定义路由处理

//dialog
var dialogHandler = Handler(
    handlerFunc: (BuildContext context, Map<String, List<String>> params) {
      return MyDialog();
    });

class Routes {
  static String root = "/";
  static String transitionPage = "/transition";
  static String homePage = "/home";

  static String sqflitePage = "/sqflite";
  static String eventBusPage = "/eventBus";
  static String fileZipPage = "/fileZip";
  static String webViewPlginPage = "/webViewPlgin";
  static String flutterWebViewPage = "/flutterWebView";
  static String providerPage = "/provider";
  static String sharedPreferences = "/sharedPreferences";
  static String flutterChannel = "/flutterChannel";
  static String urlLauncher = "/urlLauncher";
  static String dialogShow = "/dialogShow";
  static String bannerPage = "/bannerPage";


  static void configureRoutes(Router router) {
    router.notFoundHandler = Handler(
        handlerFunc: (BuildContext context, Map<String, List<String>> params) {
        });

    router.define(transitionPage, handler: transitionHandler);
    router.define(homePage, handler: homeHandler);


    router.define(sqflitePage, handler: sqfliteHandler);
    router.define(eventBusPage, handler: eventBusHandler);
    router.define(fileZipPage, handler: fileZipHandler);
    router.define(webViewPlginPage, handler: webViewPlginHandler);
    router.define(flutterWebViewPage, handler: flutterWebViewHandler);
    router.define(providerPage, handler: providerHandler);
    router.define(sharedPreferences, handler: spHandler);
    router.define(flutterChannel, handler: channelHandler);
    router.define(urlLauncher, handler: urlLauncherHandler);
    router.define(dialogShow, handler: dialogHandler);
    router.define(bannerPage, handler: bannerHandler);

  }
}

4、路由导航

          //Diaolog
            Application.router.navigateTo(context, Routes.dialogShow,
                transition: TransitionType.cupertino);

代码解析：

1、路由定义
router.define(dialogShow, handler: dialogHandler);
路径和处理函数封装成一个节点AppRoute存储在树结构的总路由表中RouteTree

router.dart

  static final appRouter = Router();

  /// The tree structure that stores the defined routes
  final RouteTree _routeTree = RouteTree();

  /// Generic handler for when a route has not been defined
  Handler notFoundHandler;

  /// Creates a [PageRoute] definition for the passed [RouteHandler]. You can optionally provide a default transition type.
  void define(String routePath,
      {@required Handler handler, TransitionType transitionType}) {
    _routeTree.addRoute(
      AppRoute(routePath, handler, transitionType: transitionType),
    );
  }

common.dart

class AppRoute {
  String route;
  dynamic handler;
  TransitionType transitionType;
  AppRoute(this.route, this.handler, {this.transitionType});
}

2、路由导航
根据路径匹配RouteMatch，使用RouteMatch中的route，进行Navigator.push(context, route);

router.dart

///
  Future navigateTo(BuildContext context, String path,
      {bool replace = false,
      bool clearStack = false,
      TransitionType transition,
      Duration transitionDuration = const Duration(milliseconds: 250),
      RouteTransitionsBuilder transitionBuilder}) {
    RouteMatch routeMatch = matchRoute(context, path,
        transitionType: transition,
        transitionsBuilder: transitionBuilder,
        transitionDuration: transitionDuration);
    Route<dynamic> route = routeMatch.route;
    Completer completer = Completer();
    Future future = completer.future;
    if (routeMatch.matchType == RouteMatchType.nonVisual) {
      completer.complete("Non visual route type.");
    } else {
      if (route == null && notFoundHandler != null) {
        route = _notFoundRoute(context, path);
      }
      if (route != null) {
        if (clearStack) {
          future =
              Navigator.pushAndRemoveUntil(context, route, (check) => false);
        } else {
          future = replace
              ? Navigator.pushReplacement(context, route)
              : Navigator.push(context, route);
        }
        completer.complete();
      } else {
        String error = "No registered route was found to handle '$path'.";
        print(error);
        completer.completeError(RouteNotFoundException(error, path));
      }
    }

    return future;
  }

routeSettings 配置路径，handler 配置为matchRoute匹配route中的handler
android 平台默认动画情况下通过MaterialPageRoute进行路由

    RouteSettings settingsToUse = routeSettings;
    if (routeSettings == null) {
      settingsToUse = RouteSettings(name: path);
    }
    AppRouteMatch match = _routeTree.matchRoute(path);
    AppRoute route = match?.route;
    Handler handler = (route != null ? route.handler : notFoundHandler);



RouteCreator creator =
        (RouteSettings routeSettings, Map<String, List<String>> parameters) {
      bool isNativeTransition = (transition == TransitionType.native ||
          transition == TransitionType.nativeModal);
      if (isNativeTransition) {
        if (Theme.of(buildContext).platform == TargetPlatform.iOS) {
          return CupertinoPageRoute<dynamic>(
              settings: routeSettings,
              fullscreenDialog: transition == TransitionType.nativeModal,
              builder: (BuildContext context) {
                return handler.handlerFunc(context, parameters);
              });
        } else {
          return MaterialPageRoute<dynamic>(
              settings: routeSettings,
              fullscreenDialog: transition == TransitionType.nativeModal,
              builder: (BuildContext context) {
                return handler.handlerFunc(context, parameters);
              });
        }
      }