Today, THERE are two ways to jump to a page with Flutter

• routing
• navigation
• Return to previous page
• Page destruction
• SwitchListTile

routing

1. Declare a route

There needs to be a Routes () route property in the MaterialApp(). In which the route is declared

MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text("AppBar"),
        ),
        body: MainHomePage(),
      ),
      routes: <String, WidgetBuilder>{// Declare a route
        "flutter_demo1": (BuildContext content) => Flutter_Demo1(),
        "flutter_demo2": (BuildContext content) => Flutter_Demo2(),
        "flutter_demo3": (BuildContext content) => Flutter_Demo3(),
        "flutter_demo4": (BuildContext content) => Flutter_Demo4(),
        "flutter_demo5": (BuildContext content) => Flutter_Demo5(),
        "flutter_demo6": (BuildContext content) {// It can also be written this way
           returnFlutter_Demo6(); }},);Copy the code

2. Specify a route name to redirect according to the route name

 Navigator.pushNamed(context, "flutter_demo6");// Jump to flutter_demo6
Copy the code

navigation

Navigator.push(
 context, 
 MaterialPageRoute(
 		builder: (context) => Flutter_Demo4()
 		)
 );
Copy the code

Return to previous page

GestureDetector(// Gesture response (described in the next chapter)
            onTap: (){
              Navigator.pop(context);// Return to the jacket page
            },
            child: Icon(Icons.arrow_back),

          ),
Copy the code

Page destruction

Navigator.pushAndRemoveUntil(context,
           new MaterialPageRoute(builder: (BuildContext context) {
           			// Jump to the page
                   return MainPage();
            }), (route) => route == null
 );
Copy the code

SwitchListTile

Sliding component

 SwitchListTile(
            title: Text('${isByName? '':'Don't'} Whether to enable routing '),
            value: isByName,// Whether it is selected
            subtitle: Text("Subtitle"),/ / subtitle
            dense: true.// Whether to center vertically the default is false
          activeColor: Colors.black,// Slide the ball color when selected
          activeTrackColor: Colors.yellow,// The color of the guide rail
          inactiveThumbColor: Colors.red,// Slide the ball color when it is not selected
          inactiveTrackColor: Colors.deepPurple,// Slide color if not selected

          secondary: Icon(Icons.android),// The left image
          selected: true.// The image to the left of the subtitle follows activeColor color changes
            onChanged: (value) {// Respond to events
              setState(() {
                print(("SZJsetState")); isByName = value; }); },)Copy the code

Effect:

The complete code