Flutter頁(yè)面導(dǎo)航

總結(jié)一下flutter內(nèi)部頁(yè)面關(guān)于導(dǎo)航的幾種用法:

一. 使用Navigator的push方法蝗砾,并實(shí)現(xiàn)MaterialPageRoute的build方法快鱼,打開(kāi)新頁(yè)面:

Navigator.push(context, MaterialPageRoute(builder: (_) {
  return DetailScreen()
}

返回用navigator的pop方法

Navigator.pop(context);

二.用頁(yè)面的名字導(dǎo)航到不同頁(yè)面:

void main() {
  runApp(MaterialApp(
    title: 'navi base',
    //1.設(shè)置初始頁(yè)面的名字.
    initialRoute: '/',
    //2.在runApp里初始化路由數(shù)組routes
    routes: {
      '/': (context) => FirstRoute(),
      '/second': (context) => SecondRoute()
    },
  ));
}

使用navigator的pushNamed方法push到對(duì)應(yīng)的頁(yè)面

Navigator.pushNamed(context, '/second');

三.導(dǎo)航時(shí)帶參數(shù):

1.用navigator的pushNamed方法push頁(yè)面,在arguments里加入?yún)?shù):

Navigator.pushNamed(context, ExtractArgumentsScreen.routeName, 
  arguments: ScreenArguments(  'Extract Arguments Screen',  'This message is extracted in the build method.', ), 
);

在導(dǎo)航的目的頁(yè)面的build方法里用ModalRoute.of(context)方法獲取需要的參數(shù):

final ScreenArguments args = ModalRoute.of(context).settings.arguments;

2.或者使用onGenerateRoute方法:

MaterialApp(
  onGenerateRoute: (settings) {
      // 從這里拿到數(shù)據(jù)并解析
    if (settings.name == PassArgumentsScreen.routeName) {
      final ScreenArguments args = settings.arguments;
    //解析成功之后再創(chuàng)建目的頁(yè)面幢码,傳遞參數(shù)
      return MaterialPageRoute(
        builder: (context) {
          return PassArgumentsScreen(
            title: args.title,
            message: args.message,
          );
        },
      );
    }
  },
);

四.返回的時(shí)候帶參數(shù):

第二個(gè)頁(yè)面返回到第一個(gè)頁(yè)面的時(shí)候如果要帶參數(shù)担平,可以使用async異步方法來(lái)實(shí)現(xiàn)

//......略.......
onPressed: () {
  //button的點(diǎn)擊事件是一個(gè)異步方法:
  _navigateAndDisplaySelection(context);
},
//......略.......
//實(shí)現(xiàn)這個(gè)異步方法
_navigateAndDisplaySelection(BuildContext context) async {
   final result = await Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondScreen()),
   );
}
//獲取到返回值result之后進(jìn)行相應(yīng)的操作:
Scaffold.of(context)
  ..removeCurrentSnackBar()
   ..showSnackBar(SnackBar(content: Text("$result")));
.............

五.用頁(yè)面的初始化方法傳遞參數(shù):

class DetailScreen extends StatelessWidget {
  //屬性
  final Todo todo;
  //聲明初始化方法的時(shí)候加上參數(shù)this.todo
  DetailScreen({Key key, @required this.todo}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    // 生成UI
    return Scaffold(
      appBar: AppBar(
        title: Text(todo.title),
      ),
      body: Padding(
        padding: EdgeInsets.all(16.0),
        child: Text(todo.description),
      ),
    );
  }
}

用navigator的push方法,在頁(yè)面的初始化方法中傳遞參數(shù):

 onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => DetailScreen(todo: todos[index]),//用頁(yè)面的初始化方法傳遞參數(shù)
          ),
        );
      },
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末扶供,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子裂明,更是在濱河造成了極大的恐慌椿浓,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,816評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件闽晦,死亡現(xiàn)場(chǎng)離奇詭異扳碍,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)仙蛉,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,729評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén)笋敞,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人荠瘪,你說(shuō)我怎么就攤上這事夯巷。” “怎么了哀墓?”我有些...
    開(kāi)封第一講書(shū)人閱讀 158,300評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵趁餐,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我篮绰,道長(zhǎng)后雷,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,780評(píng)論 1 285
  • 正文 為了忘掉前任阶牍,我火速辦了婚禮喷面,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘走孽。我一直安慰自己惧辈,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,890評(píng)論 6 385
  • 文/花漫 我一把揭開(kāi)白布磕瓷。 她就那樣靜靜地躺著盒齿,像睡著了一般念逞。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上边翁,一...
    開(kāi)封第一講書(shū)人閱讀 50,084評(píng)論 1 291
  • 那天翎承,我揣著相機(jī)與錄音,去河邊找鬼符匾。 笑死叨咖,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的啊胶。 我是一名探鬼主播甸各,決...
    沈念sama閱讀 39,151評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼焰坪!你這毒婦竟也來(lái)了趣倾?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 37,912評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤某饰,失蹤者是張志新(化名)和其女友劉穎儒恋,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體黔漂,經(jīng)...
    沈念sama閱讀 44,355評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡诫尽,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,666評(píng)論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了瘟仿。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片箱锐。...
    茶點(diǎn)故事閱讀 38,809評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡比勉,死狀恐怖劳较,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情浩聋,我是刑警寧澤观蜗,帶...
    沈念sama閱讀 34,504評(píng)論 4 334
  • 正文 年R本政府宣布,位于F島的核電站衣洁,受9級(jí)特大地震影響墓捻,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜坊夫,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,150評(píng)論 3 317
  • 文/蒙蒙 一砖第、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧环凿,春花似錦梧兼、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,882評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)渡紫。三九已至,卻和暖如春考赛,著一層夾襖步出監(jiān)牢的瞬間惕澎,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,121評(píng)論 1 267
  • 我被黑心中介騙來(lái)泰國(guó)打工颜骤, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留唧喉,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,628評(píng)論 2 362
  • 正文 我出身青樓忍抽,卻偏偏與公主長(zhǎng)得像欣喧,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子梯找,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,724評(píng)論 2 351

推薦閱讀更多精彩內(nèi)容

  • 原文:ReactNative頁(yè)面跳轉(zhuǎn)Navigator ReactNative頁(yè)面跳轉(zhuǎn)Navigator Navi...
    難卻卻閱讀 2,820評(píng)論 0 1
  • ANavigator稍微復(fù)雜點(diǎn)的移動(dòng)應(yīng)用都會(huì)有頁(yè)面跳轉(zhuǎn)的場(chǎng)景唆阿,即用戶在頁(yè)面A上點(diǎn)擊某個(gè)功能,比如查看內(nèi)容詳情或者幫...
    conf1234閱讀 1,458評(píng)論 0 3
  • React Native 進(jìn)階(四)--導(dǎo)航器 導(dǎo)航器對(duì)比 如果你剛開(kāi)始接觸锈锤,那么直接選擇Navigator就好驯鳖。...
    呼呼哥閱讀 1,024評(píng)論 0 0
  • 大部分應(yīng)用程序都包含多個(gè)頁(yè)面,并希望用戶能從當(dāng)前屏幕平滑過(guò)渡到另一個(gè)屏幕久免。移動(dòng)應(yīng)用程序通常通過(guò)被稱(chēng)為“屏幕”或“頁(yè)...
    皺巴巴閱讀 41,251評(píng)論 10 69
  • Swift1> Swift和OC的區(qū)別1.1> Swift沒(méi)有地址/指針的概念1.2> 泛型1.3> 類(lèi)型嚴(yán)謹(jǐn) 對(duì)...
    cosWriter閱讀 11,093評(píng)論 1 32