第一點:push使用javascript
1.pushNamed——Navigator.of(context).pushNamed('routeName');
此種方法只是簡單的將咱們須要進入的頁面push到棧頂,以此來顯示當前頁面,其參數是一個字符串類型,傳入的是頁面對應的路由名稱
該路由名稱須要在程序主入口中進行定義。定義方法爲:php
void main() {
runApp(
new MaterialApp( home: new Screen1(), routes: <String, WidgetBuilder> { '/screen1': (BuildContext context) => new Screen1(), '/screen2' : (BuildContext context) => new Screen2(), '/screen3' : (BuildContext context) => new Screen3(), }, ) ); }
使用:Navigator.of(context).pushNamed('/screen1'); 直接進入screen1頁面(每次都將新建一個新的頁面)css
2.1 pushReplacementNamed——Navigator.of(context).pushReplacementNamed('/screen4');
指把當前頁面在棧中的位置替換成跳轉的頁面(替換導航器的當前路由,經過推送路由[routeName]),當新的頁面進入後,以前的頁面將執行dispose方法。
下面爲官方說明:java
Replace the current route of the navigator that most tightly encloses the given context by pushing the route named [routeName] and then disposing the previous route once the new route has finished animating in.
即好比當前從頁面1進入頁面2,在頁面2使用
Navigator.of(context).pushReplacementNamed('/screen3');進入頁面3,當進入了頁面3後,頁面2將執行dispose方法,此時在頁面3返回時,會回到頁面1.python
使用狀況:例如
從SplashScreen到HomeScreen。它應該只顯示一次,用戶不該該再從主屏幕回到它。在這種狀況下,因爲咱們將要進入一個全新的屏幕,
咱們可能想要使用這個方法來實現它的enter animation屬性。ruby
2.2 pushReplacement——Navigator.pushReplacement( context, MaterialPageRoute(builder: (BuildContext context) => screen4()));
這個用法跟2.1相同,只是路由的傳遞有差異,上方的是傳遞路由名稱(頁面對應的名稱,需在入口定義(本文第一點)),然後者只需new對應頁面便可,並且能夠傳遞
參數(傳參方式相似於本文後續所說的傳遞方法)。bash
3.popAndPushNamed——Navigator.popAndPushNamed(context, '/screen4');
指將當前頁面pop,而後跳轉到制定頁面(將當前路由彈出導航器,並將命名路由推到它的位置。)
下面爲官方說明:less
Pop the current route off the navigator that most tightly encloses the
given context and push a named route in its place.
使用狀況:例如
在購物應用中,有產品列表,用戶在產品列表中能夠經過篩選,來進一步選擇商品,在這個過程當中,用戶點擊篩選按鈕時,會進入篩選條件選擇界面,當用戶點擊
肯定篩選按鈕時,應彈出篩選界面,並使用新的篩選條件進入產品列表。這種狀況popAndPushNamed就更合適了。ide
4.pushNamedAndRemoveUntil——Navigator.of(context).pushNamedAndRemoveUntil('/screen4', (Route<dynamic> route) => false);
指將制定的頁面加入到路由中,而後將其餘全部的頁面所有pop, (Route<dynamic> route) => false將確保刪除推送路線以前的全部路線。
這時候將打開一個新的screen4頁面函數
Push the route with the given name onto the navigator, and then remove all the previous routes until the `predicate` returns true.
使用狀況:例如
當用戶點擊了退出登陸時,咱們須要進入某一個頁面(好比點退出登陸後進入了登陸頁),這個時候用戶點擊返回時不該該能進入任何一個頁面,這種狀況就可使用。
5.1 pushNamedAndRemoveUntil——Navigator.of(context).pushNamedAndRemoveUntil('/screen4', ModalRoute.withName('/screen1'));
指將制定的頁面加入到路由中,而後將以前的路徑移除知道制定的頁面爲止(將具備給定名稱的路由推到導航器上,而後刪除全部路徑前面的路由直到'predicate'返回true爲止。)
這時候將銷燬棧內除了screen4的頁面,點擊直接去棧內screen4,這時screen4會從新build
Push the route with the given name onto the navigator, and then remove all the previous routes until the `predicate` returns true.
使用狀況:例如
一個購物應用程序的例子!或者任何須要支付交易的應用程序。所以,在這些應用程序中,一旦用戶完成了支付事件,全部與交易或購物車相關的屏幕都應該從堆棧中刪除,用戶應該進入到支付確認頁面。單擊back按鈕應將它們返回到產品列表或主屏幕。
使用實例:
1-->2-->3,3到4時使用Navigator.pushNamedAndRemoveUntil(context,"/screen4",ModalRoute.withName('/screen1'));
這時候若是在頁面4點擊返回,將會直接退出程序。
1-->2-->3,3到4時使用Navigator.pushNamedAndRemoveUntil(context,"/screen4",ModalRoute.withName('/'));
這時候若是在頁面4點擊返回,將會直接回到頁面1。
1-->2-->1-->2-->3,3到4時使用Navigator.pushNamedAndRemoveUntil(context,"/screen4",ModalRoute.withName('/screen1'));
這時候若是在頁面4點擊返回,將會回到第二個1頁面。
5.2
Navigator.pushAndRemoveUntil(
context,
MaterialPageRoute(builder: (BuildContext context) => new screen4()), ModalRoute.withName('/'),
這種方法跟上述方法做用相同,不一樣之處在於,上述傳遞的是路由名稱,這個名稱須要你在入口處進行路由指定,而這種則無需指定,直接new 出來便可,
並且能夠傳遞參數。(看其名稱便可發現差異pushNamedAndRemoveUntil與pushAndRemoveUntil)使用這種做用以下
1-->2-->3,3到4時使用此方法,這時候若是在頁面4點擊返回,將會直接回到頁面1。
若是使用
Navigator.pushAndRemoveUntil(
context,
MaterialPageRoute(builder: (BuildContext context) => Screen4()), (Route<dynamic> route) => false, );
這時候進入4後。4將成爲惟一的一個頁面。其餘頁面都將pop出棧,這個跟上述pushNamedAndRemoveUntil也一致。
6.popUntil——Navigator.popUntil(context, ModalRoute.withName('/screen2'));
有些應用場景下,用戶可能不得不填寫一個由三部分組成的長表單,該表單可能在移動應用程序的三個連續屏幕中顯示。如今在表單的第三個頁面,用戶決定取消填寫表單。用戶單擊Cancel,就會彈出全部以前的與表單相關的屏幕,並將用戶帶回主屏幕,從而丟失全部與表單相關的數據(在這種狀況下,這是咱們想要的)。咱們不會在這裏推出任何新東西,只是回到之前的路線。
第二點 pop
1.Navigator.of(context).maybePop();
maybePop 會自動進行判斷,若是當前頁面pop後,會顯示其餘頁面,不會出現問題,則將執行當前頁面的pop操做
不然將不執行。
2.Navigator.of(context).canPop();
canPop 判斷當前頁面可否進行pop操做,並返回bool值
3.Navigator.of(context).pop();
直接退出當前頁面
第三點 傳參和參數返回
傳參的方式很簡單,在須要接收參數的頁面進行參數定義,並加入其構造函數中,在跳轉到該頁面時,使用MaterialPageRoute並在頁面中傳入參數便可。
String params; Navigator.push(context, new MaterialPageRoute(builder: (BuildContext context) => new mainPage(params))); 接收參數 class mainPage extends StatelessWidget { final String userName; mainPage(this.userName); @override Widget build(BuildContext context) { print(userName); }
帶返回值的頁面跳轉:
String userName = "yinll"; Navigator.push( context, new MaterialPageRoute( builder: (BuildContext context) => new Screen5(userName))).then((data){ result =data; print(result); });
而後screen5中,在返回時使用:Navigator.of(context).pop('這是頁面5返回的參數');
在pop中寫上返回的的值,這時候在上方的then中便可獲得返回的數據。
好啦 小夥伴們,今天就先說這麼多,,後續我也會保持用法的不斷更新,能夠點下關注,以便及時獲得更新通知哦。哈哈!
做爲剛入坑Flutter的我而言,有些說的可能也存在錯誤,歡迎批評指正!
連接:https://www.jianshu.com/p/44650be76110