路由最基本的使用-頁面跳轉(zhuǎn)和退出

使用Navigator.push()來跳轉(zhuǎn)頁面

onPressed: () {
  Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondRoute()),
  );
}

使用Navigator.pop()來返回上一個頁面

onPressed: () {
  Navigator.pop(context);
}

通過Named Routes（路由表）來做跳轉(zhuǎn)

定義創(chuàng)建的route

MaterialApp(
  // 定義APP啟動時第一個顯示的頁面，在本例中，initialRoute指代FirstScreen
  initialRoute: '/',
  routes: {
    // 當(dāng)navigating到‘/’ route時，構(gòu)建FirstScreen widget
    '/': (context) => FirstScreen(),
    // 當(dāng)navigating 到"/second" route, 構(gòu)建SecondScreen widget.
    '/second': (context) => SecondScreen(),
  },
);

Navigate到SecondScreen

onPressed: () {
  // 跳轉(zhuǎn)到SecondScreen
  Navigator.pushNamed(context, '/second');
}

在跳轉(zhuǎn)中傳值

準(zhǔn)備傳遞的數(shù)據(jù)

class ScreenArguments {
  final String title;
  final String message;
 
  ScreenArguments(this.title, this.message);
}

接受傳遞的數(shù)據(jù)

class ExtractArgumentsScreen extends StatelessWidget {
  static const routeName = '/extractArguments';
 
  @override
  Widget build(BuildContext context) {
    //獲取傳遞的參數(shù)
    final ScreenArguments args = ModalRoute.of(context).settings.arguments;
 
    return Scaffold(
      appBar: AppBar(
        title: Text(args.title),
      ),
      body: Center(
        child: Text(args.message),
      ),
    );
  }
}

將準(zhǔn)備好的參數(shù)傳遞過去

RaisedButton(
  child: Text("使用pushNamed攜帶參數(shù)跳轉(zhuǎn)"),
  onPressed: () {
    //點擊事件，觸發(fā)跳轉(zhuǎn)
    Navigator.pushNamed(
      context,
      ExtractArgumentsScreen.routeName,
      arguments: ScreenArguments(
        '我是被傳遞的title',
        '我是被傳遞的message.',
      ),
    );
  },
);

PUSH傳值

Navigator.push(
    context,
    MaterialPageRoute(
        builder: (context) => ExtractArgumentsScreen(),
        settings: RouteSettings(
            arguments: ScreenArguments(
                '我是title',
                '我是message.',
             ),
         ),
     ),
   );

使用onGenerateRoute來進行跳轉(zhuǎn)傳值

MaterialApp(
  
  onGenerateRoute: (settings) {
    // 判斷當(dāng)前route，分別進行處理
    if (settings.name == PassArgumentsScreen.routeName) {
      // 將settings.arguments轉(zhuǎn)換為正確的類型 ScreenArguments.
      final ScreenArguments args = settings.arguments;
 
      //通過構(gòu)造方法傳值
      return MaterialPageRoute(
        builder: (context) {
          return PassArgumentsScreen(
            title: args.title,
            message: args.message,
          );
        },
      );
    }
  },
);

Navigator.push(
    context,
    MaterialPageRoute(
        builder: (context) => ExtractArgumentsScreen(),
        settings: RouteSettings(
            arguments: ScreenArguments(
                '我是title',
                '我是message.',
             ),
         ),
     ),
   );

　

攜帶參數(shù)退出

結(jié)束

總結(jié)

以上是生活随笔為你收集整理的Navigator基本用法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。