ff_annotation_route

Languages: English | 中文简体

Description

Provide a route generator to create route map quickly by annotations.

• ff_annotation_route
  • Description
  • Usage
    • Add packages to dev_dependencies
    • Add annotation
      • Empty Constructor
      • Constructor with arguments
      • FFRoute
    • Generate Route File
      • Environment
      • Activate the plugin
      • Execute command
      • Command Parameter
    • Main.dart
    • Push
      • Push name
      • Push name with arguments

Usage

Add packages to dev_dependencies

Add the package to dev_dependencies in your project/packages’s pubspec.yaml

dev_dependencies:
  ff_annotation_route: latest-version

Download with flutter packages get

Add annotation

Empty Constructor

import 'package:ff_annotation_route/ff_annotation_route.dart';

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

Constructor with arguments

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	The name of the route (e.g., “/settings”).	required
argumentNames	Arguments name passed to FFRoute.	–
argumentTypes	The types of arguments.	–
showStatusBar	Whether to show the status bar.	true
routeName	The route name to track page.	”
pageRouteType	The type of page route.(material, cupertino, transparent)	–
description	The description of the route.	”
exts	The extend arguments.	–

Generate Route File

Environment

Add dart bin into to your $PATH.

cache\dart-sdk\bin

More info

Activate the plugin

pub global activate ff_annotation_route

Execute command

Go to your project’s root and execute command.

ff_route <command> [arguments]

Command Parameter

Available commands:

command name	description
-h, –help	Print this usage information.
-p, –path [arguments]	The path of folder to be executed with commands.
-rc, –route-constants	Whether generate route names as constants.
-rh, –route-helper	Whether generate xxx_route_helper.dart
-rn, –route-names	Whether generate route names as a list.
-s, –save	Whether save commands in local, it will read commands from local next time to execute if run “ff_route” without any commands.
-na, –no-arguments	Whether RouteSettings has arguments(for lower flutter sdk).
-g, –git package1,package2	Whether scan git lib,you should specify package names and split multiple by ‘,’.
–package	Is this a package.
–no-is-initial-route	Whether RouteSettings has isInitialRoute(for higher flutter sdk).
-o –output	The path of main project route file and helper file. it is relative to the lib directory.
-rfo –routes-file-output	The path of routes file.It is relative to the lib directory.

Main.dart

• If you execute command with --route-helper, FFNavigatorObserver/FFRouteSettings will generate in xxx_route_helper.dart which help you to track page or change status bar state.
• If you execute command with --route-helper, FFTransparentPageRoute will generate in xxx_route_helper.dart which helps you to push a transparent page route.

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()),
    ),
  );
}

More info

Push

Push name

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

Push name with arguments

arguments MUST be a 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(),
    },
  );

Download Flutter annotation route source code on GitHub

https://github.com/fluttercandies/ff_annotation_route