Summary of the usage of Flutter routing

Flutter routing jump

Basic routing jump

ElevatedButton(
  onPressed: () {
    //Basic routing    (context).push(
      MaterialPageRoute(builder: (BuildContext context) {
        return const SearchPage();
      }),
    );
  },
  child: const Text("Basic routing jump"),
),

page

import 'package:flutter/';
class SearchPage extends StatefulWidget {
  final String context;
  final int aid;
  const SearchPage({
    ,
     = "",
     = 0,
  });
  @override
  State&lt;SearchPage&gt; createState() =&gt; _SearchPageStateState();
}
class _SearchPageStateState extends State&lt;SearchPage&gt; {
  @override
  void initState() {
    ();
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          //Return to the previous page route          (context);
        },
        child: const Icon(),
      ),
      appBar: AppBar(
        title: const Text("Search Page"),
      ),
      body: Center(
        child: Text(
          "${} "
          "${ == 0 ? "" : ",Codename：${}"}"
        ),
      ),
    );
  }
}

Return to the previous page of route

(context);

Basic route jump parameter transfer

ElevatedButton(
  onPressed: () {
    //Basic route jump to transfer parameters    (context).push(
      MaterialPageRoute(builder: (BuildContext context) {
        return const SearchPage(
            context: "Parameters transmitted from homepage", aid: 123456);
      }),
    );
  },
  child: const Text("Basic route jump parameter transfer"),
),

Named route jump

ElevatedButton(
  onPressed: () {
    //Name route jump    (context, "/search");
  },
  child: const Text("Name route jump"),
),

Naming route jump requires first configuration of routes

Configuration File

import 'package:flutter/';
import 'package:flutter_demo/';
import 'package:flutter_demo/';
import 'package:flutter_demo/';
//Configure routingMap routes = {
  "/search": (context) =&gt; const SearchPage(),
  "/register2": (context) =&gt; const Register2(),
  "/form": (context, {arguments}) =&gt; FormPage(arguments: arguments),
};
//Configure onGenerateRoute fixed writing method, this method is equivalent to a middleware, which can make permission judgmentsvar onGenerateRoute = (RouteSettings settings) {
  final String? name = ;
  final Function? pageContentBuilder = routes[name];
  if (pageContentBuilder != null) {
    if ( != null) {
      final Route route = MaterialPageRoute(
        builder: (context) =&gt;
            pageContentBuilder(context, arguments: ),
      );
      return route;
    } else {
      final Route route = MaterialPageRoute(
        builder: (context) =&gt; pageContentBuilder(context),
      );
      return route;
    }
  }
  return null;
};

Then you need to add initialRoute and onGenerateRoute configurations to the homepage

import 'package:flutter_demo/routers/';
void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      //Hide DEBUG icon      debugShowCheckedModeBanner: false,
      theme: ThemeData(primarySwatch: ),
      home: const Scaffold(
        body: MyHomePage(),
      ),
      initialRoute: "/",
      onGenerateRoute: onGenerateRoute,
    );
  }
}

Named route jump parameter transfer

ElevatedButton(
  onPressed: () {
    //Name route parameter transfer    (
      context,
      "/form",
      arguments: {
        "aid": 123456,
        "name": "Zhang San",
        "age": "18",
      },
    );
  },
  child: const Text("Name route parameter transfer"),
),

The path in the configuration is written in the context property, and the arguments property is the parameters that need to be taken with jump, jump to the page and receive parameters.

import 'package:flutter/';
class FormPage extends StatefulWidget {
  final Map arguments;
  const FormPage({
    ,
    required ,
  });
  @override
  State&lt;FormPage&gt; createState() =&gt; _FormPageStateState();
}
class _FormPageStateState extends State&lt;FormPage&gt; {
  @override
  void initState() {
    ();
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Form Page"),
      ),
      body: Center(
        child: Text(
          
              ? ""
              : "I am${["name"]},I${["age"]}It's，"
                  "Codename：${["aid"]}",
        ),
      ),
    );
  }
}

Named route replacement jump

(context).pushReplacementNamed("/register2");

The named route replacement jump is pushedReplacementNamed. After jumping to a new page, this page is replaced.

Remove all pages and return to the root page

(context).pushAndRemoveUntil(
    MaterialPageRoute(builder: (BuildContext context) {
  return const MyApp();
}), (route) => false);

Remove all pages and return to the specified page with pushAndRemoveUntil.

This is the end of this article about several usages of Flutter routing. For more related content on Flutter routing, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!