Page navigation in Flutter

Mar 18, 2023145

AI Translation

This post is translated from Chinese into English through AI.View Original

AI-generated summary

In Dart, there are two methods to navigate between pages in an app. The first method involves defining the route names and the corresponding pages in the MaterialApp widget. Then, using the Navigator.of(context).pushNamed("routeName") method, the app can navigate to the desired page based on the route name. The second method does not require defining a route table. Instead, the Navigator.push(context, MaterialPageRoute(builder: (context) { ... })) method is used to navigate to a page directly. This method allows for passing arguments to the destination page easily. Compared to Android, this method is more convenient as it does not require bundling data.

One method is

new MaterialApp(
      title: '',
      theme: new ThemeData(
        primarySwatch: Colors.cyan,
      ),
      home: new MyHomePage(title: ''),
       routes: {
         '/sortiePage': (BuildContext con)=> new SortiePage()
       },
    );

First, define the names of the routes and the pages to navigate to in the app.

Then

Navigator.of(context).pushNamed("routeName");

It obtains the route table based on the context, and then navigates to the predefined page based on the route name.

Another method

Without defining a route table, directly

Navigator.push(
   context, 
   MaterialPageRoute(
     builder: (context){
       return new SortiePage(
         args: your args data,
       );
     }
   ) 
);

This method is not as intuitive as using a route table, but it is convenient for passing parameters.

One advantage of writing in Dart compared to Android is that you don't have to deal with bundling data in such a cumbersome way.