This is the 14th day of my participation in the November Gwen Challenge. Check out the event details: The last Gwen Challenge 2021

Two days ago, I tried the page jump of Flutter, mainly through the Navigator related push and pop methods for page jump and basic parameter transfer, which is very convenient and simple. Today’s tip adds another method of page hopping that is commonly used during Flutter testing.

Added a

Dart: Dart: dart: dart: dart: dart: dart: dart: dart: dart: dart This is not reasonable, according to the normal business logic there will be a lot of subcontracting, so how to jump to other packages or other files under the Page Page? It’s easy to import the package name file:

  1. Tests found that Flutter does not have the same manifest file as Android, so you need to import the package name file manually.

2. Call the Page in the corresponding file to skip to the Page.

      Tips:You are advised not to have the same Page name in different files. If the Page name in this file is the same as that in other files, the Page in this file is preferentially forwarded.

Added two fluro

Fluro is a triparty library of Flutter about page jumps. It adds flexible options, such as wildcards, named parameters, and clear jump definitions.

The integration is as follows:
  1. Add fluro dependency library fluro to pubspec.yaml: “^1.3.4”, as shown in figure:

2. Import the package to the page to which you want to jump and initialize a Router. You can define global or static variables for reference in other places. As shown in figure:

import 'package:fluro/fluro.dart';

Router router = new Router();
Copy the code

3. Define routes and Route Handlers after initialization

var homeHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) {
  return HomePage(params["data"][0]);
});

void defineRoutes(Router router) {
  router.define("/home/:data", handler: homeHandler);
}

defineRoutes(router);
Copy the code

Params [“data”][0] can only pass 0, otherwise the array is out of bounds.

NavigateTo: navigateTo:

Var bodyJson = {'user': (_phonecontroller.text), 'pass': (_pwdController.text)}; // router.navigateTo(context, "/home/1234", transition: TransitionType.fadeIn); router.navigateTo(context, '/home/$bodyJson'); }Copy the code

/home/:data (String/int); /home/:data (String/int) The peer router can also transfer data to itself. Add transition: transitionType.fadein.

      GitHub Demo

Xiao CAI has not been in touch with Flutter for a long time, and there are still many unclear and ununderstood aspects. I hope to point out more if there are wrong aspects.

Source: Little Monk A Ce