Record the code first, and then improve the content

Route Route

Static Routing

There are two ways of routing jumps in Flutter, one is static routing, which is created with a clear understanding of the page and value to jump.The other is dynamic routing, where both the jump to the incoming destination address and the value to be passed in can be dynamic.

OK, or let's start with static routing

From the time we started learning Flutter to now, I'm sure the most you've seen is the following code

void main(){
  runApp(new MaterialApp());
}

A MaterialApp Widget needs to be passed in the runApp method, but we basically use the home attribute, but there are many parameters in the MaterialApp method, among which the routes parameter is the one that defines the route.

routes: {}

routes requires an incoming type of Map. The first parameter is the name of the destination route, and the second parameter is the page you want to jump to.
Well, let's take an example and see how to use it
main.dart

import 'package:flutter/material.dart';
import 'package:flutteraa/MyHomePage.dart';
import 'package:flutteraa/PlatformPage.dart';
import 'package:test1/route/Page2.dart';
import 'package:test1/route/Page1.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Welcome to Flutter',
      theme: ThemeData(primaryColor: Colors.blue),
      home: Page1(),
      routes: <String, WidgetBuilder>{'page2': (_) => Page2()},
    );
  }
}

First page:

import 'package:flutter/material.dart';
import 'package:test1/route/Page2.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Page1"),
      ),
      body: new Center(
        child: new RaisedButton(
          onPressed: () {
            Navigator.of(context).pushNamed("page2");
          },
          child: new Text("Click me to jump"),
          color: Colors.blue,
          highlightColor: Colors.lightBlue,
        ),
      ),
    );
  }
}

In the Main method on the first page, we define the name of the page we need to jump to is Page2, and the page we want to jump to is Page2, which triggers the call whenever we click the button in the center of the screen

Navigator.of(context).pushNamed("/page2");

Navigator is responsible for page navigation in Flutter, and I believe children who know Android know about it.
Use the pushNamed method to pass in a name defined in routes.

Second page:

import 'package:flutter/material.dart';
class Page2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Page2"),
      ),
      body: new Center(
        child: new Text(
          "Page2",
          style: new TextStyle(fontSize: 25.0),
        ),
      ),
    );
  }
}

Okay, so it's really easy to try to pass data down to the next page. Let's add a constructor to the second page and assign the value passed from the first page to Text

import 'package:flutter/material.dart';

class Page2 extends StatelessWidget {
  final title;

  Page2(this.title);

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Page2"),
      ),
      body: new Center(
        child: new Text(
          title,
          style: new TextStyle(fontSize: 25.0),
        ),
      ),
    );
  }
}

When defining a route on the first page, you need to define the parameters you need to pass.

routes: <String, WidgetBuilder>{
'page2': (BuildContext context) => new Page2("I am from Page1"),
},

This is a very simple way to define routes and use them, but you will certainly find that if the data I need to pass to the second page is not known, I will not be able to use it because we cannot dynamically change the values defined above.

So we need to understand dynamic routing in Flutter.

Dynamic Routing

Another method in Navigator is the push() method, which requires a Route object to be passed in. In Flutter, we can use PageRouteBuilder to build this Route object.

So we can do the following in Button's click event:

Navigator.of(context).push(new PageRouteBuilder(
pageBuilder: (BuildContext context,
    Animation<double> animation,
Animation<double> secondaryAnimation) {
return new Page2("some attrs you like ");

}))

In this way, we can transfer the user's operation and interaction data to the next page.

Global code:

Page 1:

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutteraa/PlatformPage.dart';

class MyHomePage extends StatefulWidget {
  @override
  createState() => new MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {


  @override
  Widget build(BuildContext context) {
    return   Scaffold(
      appBar: AppBar(
        title: Text(
          'Tab',
          style: TextStyle(fontSize: 18.0),
        ),
        backgroundColor: Colors.blue,
      ),
      body: Column(
        children: <Widget>[
          RaisedButton(
            onPressed: _btnPress,
            child: Text('Jump'),
          ),
        ],
      ),
    );

  }

  Future _btnPress() {
  //Static routes, route configuration required
    //Navigator.pushNamed(context, 'Platform');
    //Dynamic Routing, Jump and Pass Parameters
    Future future = Navigator.push(context, PageRouteBuilder(pageBuilder:
        (BuildContext context, Animation<double> animation,
        Animation<double> secondaryAnimation) {
      return PlatformPage(":Get power");
    }));
    future.then((value) {
      showDialog(
          context: context,
          builder: (context) => AlertDialog(
            title: Text('The data previously returned is:$value'),
          ));
    });
  }
}

Page 2:

/*
 * Created by Li Zhuoyuan on September 6, 2018.
 * email: zhuoyuan93@gmail.com
 *
 */

import 'dart:async';

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

class PlatformPage extends StatefulWidget {
  final title;

  PlatformPage(this.title);

  @override
  State<StatefulWidget> createState() => PlatformPageState(title);
}

class PlatformPageState extends State<PlatformPage> {
  static const platform = const MethodChannel('flutteraa/battery');
  String _batteryLevel = 'Unknown battery level.';
  final title;

  PlatformPageState(this.title);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Platform Code $title'),
      ),
      body: Column(
        children: <Widget>[ 
          RaisedButton(
            onPressed: _goback,
            child: Text('Return'),
          )
        ],
      ),
    );
  }

  void _goback() {
  //Return to the previous page and pass parameters
    Navigator.pop(context,'aiyo');
  }
}

main.dart

import 'package:flutter/material.dart';
import 'package:flutteraa/MyHomePage.dart';
import 'package:flutteraa/PlatformPage.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        title: 'Welcome to Flutter',
        theme: ThemeData(primaryColor: Colors.blue),
        home: MyHomePage(),
        routes: <String,WidgetBuilder>{
          'Platform':(_)=>PlatformPage('a')
        }, 
    );
  }
}