Flutter Learning: Routing

1. Common routing usage in Flutter

For example, if we now want to jump from HomePage component to SearchPage component 1, we need to introduce SearchPage.dart in HomPage

import ' . ./searchpage.dart';

Jump through the following method in HomePage

​2. Ordinary routing jump transfer value in Flutter

The implementation method of jump passing value and calling component passing value is the same

 ① Define a SearchPage to receive the passed value, and get the value through widget.xxx

 ② Jump to the page to realize value passing

 3. Named Routing in Flutter

①Introduce all routes to be redirected in main.dart

② Configure routing through routes, you need to comment out home

 ③ Configure the jump route on the page to be jumped

 

 4. Named route passing value in Flutter

① Define the routes of the map type

②Call onGenerateRoute processing (fixed writing method)

 ③ Define the page to receive arguments and pass parameters

 

 ④Jump page (form page) to realize parameter passing

5. Flutter returns to the upper level route

Navigator.of(context).pop();

6. Replace routing in Flutter

For example, we jumped from the user center page to the registerFirst page, and then jumped from the registerFirst page to the registerSecond page through pushReplacementNamed. At this time, when we click the return button of registerSecond, it will directly return to the user center.

Navigator.of(context).pushReplacementNamed('/registerSecond');

7. Flutter returns to the root route

For example, we jump from the user center to the registerFirst page, then jump from the registerFirsts page to the registerSecond page, and then jump from registerSecond to the registerThird page. At this time, what we think is that registerThird returns to the user center after successful registration. this

Time to use the method of returning to the root route.

8. Flutter Android and los use the same style of routing jump

The Material component library provides a MaterialPageRoute component, which can use the routing switching animation consistent with the platform style, such as sliding left and right on iOS, and sliding up and down on Android. CupertinoPageRoute is an iOS-style route provided by the Cupertino component library. Switch component, if you want to use left and right switching styles on Android, you can use CupertinoPageRoute.​

1. Delete material.dart and import cupertino.dartimport 'package:flutter/cupertino.dart';

2. Replace MaterialPageRoute with CupertinoPageRoute

Guess you like

Origin blog.csdn.net/m0_73533910/article/details/131469726