Flutter路由(一)


第一點:push使用

1.pushNamed——Navigator.of(context).pushNamed('routeName')

  Navigator.of(context).pushNamed('/screen1'); 直接進入screen1頁面(每次都將新建一個新的頁面)

2.pushReplacementNamed——Navigator.of(context).pushReplacementNamed('routeName')

  指把當前頁面在棧中的位置替換成跳轉的頁面(替換導航器的當前路由,通過推送路由[routeName]),當新的頁面進入后,之前的頁面將執行dispose方法。

  即比如當前從頁面1進入頁面2,在頁面2使用 Navigator.of(context).pushReplacementNamed('/screen3');進入頁面3,當進入了頁面3后,頁面2將執行dispose方法,此時在頁面3返回時,會回到頁面1.

  使用情況:例如 從SplashScreen到HomeScreen。它應該只顯示一次,用戶不應該再從主屏幕回到它。在這種情況下,由於我們將要進入一個全新的屏幕, 我們可能想要使用這個方法來實現它的enter animation屬性。

 3.pushReplacement——Navigator.pushReplacement( context, MaterialPageRoute(builder: (BuildContext context) => screen4()))

   pushReplacement只需new對應頁面即可,而且可以傳遞 參數(傳參方式類似於本文后續所說的傳遞方法)。和pushReplacementNamed只是路由的傳遞有差別,pushReplacementNamed的是傳遞路由名稱(頁面對應的名稱,需在入口定義(本文第一點))

 4.popAndPushNamed——Navigator.popAndPushNamed(context, 'routeName')

   指將當前頁面pop,然后跳轉到制定頁面(將當前路由彈出導航器,並將命名路由推到它的位置。) 

5.pushNamedAndRemoveUntil

  5.1.Navigator.of(context).pushNamedAndRemoveUntil('/screen4', (Route<dynamic> route) => false)

 指將制定的頁面加入到路由中,然后將其他所有的頁面全部pop, (Route route) => false將確保刪除推送路線之前的所有路線。 這時候將打開一個新的screen4頁面

  5.2.Navigator.of(context).pushNamedAndRemoveUntil('/screen4', ModalRoute.withName('/screen1'))

 指將制定的頁面加入到路由中,然后將之前的路徑移除一直到制定的頁面為止(將具有給定名稱的路由推到導航器上,然后刪除所有路徑前面的路由直到'predicate'返回true為止。) 這時候將銷毀棧內除了screen4的頁面,點擊直接去棧內screen4,這時screen4會重新build
使用情況:例如 一個購物應用程序的例子!或者任何需要支付交易的應用程序。因此,在這些應用程序中,一旦用戶完成了支付事件,所有與交易或購物車相關的屏幕都應該從堆棧中刪除,用戶應該進入到支付確認頁面。單擊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.4.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()

直接退出當前頁面

 

https://github.com/mingfeng002/yinl/tree/master/yinll_flutter/lib/route_demo

打賞

免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2021 CODEPRJ.COM