【Flutter】路由原理與實作

阿寬
Oct 19, 2021

--

在Flutter中,頁面的跳轉由路由去做管理(Route Managemant),就像是在android中每個Activity間的切換,經由Intent這個物件來完成,而在Flutter中頁面跳轉則是Navigator物件,其實作方式是堆疊(Stack),假設今天有A、B兩個頁面,現在要從A頁面跳轉到B頁面,此時Navigator 會將 B頁面 push入Stack中,而若要從B頁面返回A頁面,Navigator在Stack中 pop出B,頁面則返回A,會發現其實Stack頂端元素就是現在畫面所呈現的頁面

...

實作如下:
A頁面為 HomePage
B頁面為 SecondPage

// A跳轉至B
Navigator.push(context, MaterialPageRoute(builder : (context) => new SecondPage()));

// B返回A
Navigator.pop(context);

實作成果:

GitHub 原始碼 : https://github.com/propcgrogrammer/Flutter_route_management_1

--

--

阿寬

半路出家的行動實踐者,正在搜集各位的簽名中