Skip to content

Latest commit

 

History

History
executable file
·
206 lines (162 loc) · 7.55 KB

README-ZH.md

File metadata and controls

executable file
·
206 lines (162 loc) · 7.55 KB
Raw

ff_annotation_route

pub package GitHub stars GitHub forks GitHub license GitHub issues flutter-candies

Languages: English | 中文简体

掘金地址

描述

通过注解快速完成路由映射.

使用

增加引用

添加引用到dev_dependencies，及你需要注解的project/packages到pubspec.yaml中

dev_dependencies:
  ff_annotation_route: latest-version

执行 flutter packages get 下载

添加注解

空构造

import 'package:ff_annotation_route/ff_annotation_route.dart';

@FFRoute(
  name: "fluttercandies://mainpage",
  routeName: "MainPage",
)
class MainPage extends StatelessWidget 
{
  // ...
}

带参数构造

import 'package:ff_annotation_route/ff_annotation_route.dart';

@FFRoute(
  name: "fluttercandies://picswiper",
  routeName: "PicSwiper",
  argumentNames: ["index", "pics"],
  showStatusBar: false,
  pageRouteType: PageRouteType.transparent,
)
class PicSwiper extends StatefulWidget {
  final int index;
  final List<PicSwiperItem> pics;
  PicSwiper({this.index, this.pics});
  // ...
}

FFRoute

Parameter Description Default
name 路由的名字 (e.g., "/settings"). required
argumentNames 路由的参数的名字 (只能使用") -
showStatusBar 是否显示状态栏 true
routeName 用于埋点收集数据的页面名字 ''
pageRouteType 路由的类型 (material, cupertino, transparent) -
description 路由的描述 ''

生成文件

环境

添加dart的bin的路径到你的系统 $PATH.

cache\dart-sdk\bin

更多信息

不清楚的可以看掘金

激活

pub global activate ff_annotation_route

执行命令

进入到项目根路径下执行 ff_annotation_route

你也可以直接执行，并且带上你的项目路径 ff_annotation_route path=

命令参数

使用方式为 parameter=xxx, 并用空格 ( ) 隔开多个参数。

参数 描述 默认
path 你的项目路径 当前路径
generateRouteNames 是否在根项目中的 xxx_route.dart 生成全部路由的名字 false
generateRouteConstants 是否在根项目中的 xxx_route.dart 生成全部路由的静态常量 false
mode 0或者1, 模式1会生成 xxx_route_helper.dart 来帮助你处理 showStatusBar/routeName/pageRouteType 0
routeSettingsNoArguments 如果为true， FFRouteSettings 将没有arguments这个参数,这个是主要是为了适配Flutter低版本 false

Main.dart

  • 如果运行的命令带有参数 mode=1 , FFNavigatorObserver/FFRouteSettings 将会生成在 xxx_route_helper.dart 中，用于协助追踪页面和设置状态栏。

  • 如果运行的命令带有参数 mode=1 ，FFTransparentPageRoute 将会生成在 xxx_route_helper.dart 中，可以使用它来 push 一个透明的 PageRoute 。

Widget build(BuildContext context) {
    return OKToast(
        child: MaterialApp(
      title: 'ff_annotation_route demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      navigatorObservers: [
        FFNavigatorObserver(routeChange:
            (RouteSettings newRouteSettings, RouteSettings oldRouteSettings) {
          //you can track page here
          print(
              "route change: ${oldRouteSettings?.name} => ${newRouteSettings?.name}");
          if (newRouteSettings is FFRouteSettings &&
              oldRouteSettings is FFRouteSettings) {
            if (newRouteSettings?.showStatusBar !=
                oldRouteSettings?.showStatusBar) {
              if (newRouteSettings?.showStatusBar == true) {
                SystemChrome.setEnabledSystemUIOverlays(
                    SystemUiOverlay.values);
                SystemChrome.setSystemUIOverlayStyle(
                    SystemUiOverlayStyle.dark);
              } else {
                SystemChrome.setEnabledSystemUIOverlays([]);
              }
            }
          }
        })
      ],
      builder: (c, w) {
        ScreenUtil.instance =
            ScreenUtil(width: 750, height: 1334, allowFontScaling: true)
              ..init(c);
        var data = MediaQuery.of(c);
        return MediaQuery(
          data: data.copyWith(textScaleFactor: 1.0),
          child: w,
        );
      },
      initialRoute: Routes.FLUTTERCANDIES_MAINPAGE,// fluttercandies://mainpage
      onGenerateRoute: (RouteSettings settings) =>
          onGenerateRouteHelper(settings, notFoundFallback: NoRoute()),
    ),
  );
}

更多信息

Push

Push name

  Navigator.pushNamed(context, Routes.FLUTTERCANDIES_MAINPAGE /* fluttercandies://mainpage */);

Push name with arguments

参数必须是一个 Map<String, dynamic>

  Navigator.pushNamed(
    context,
    Routes.FLUTTERCANDIES_PICSWIPER, // fluttercandies://picswiper
    arguments: {
      "index": index,
      "pics": listSourceRepository
          .map<PicSwiperItem>((f) => PicSwiperItem(f.imageUrl, des: f.title))
          .toList(),
    },
  );