“跳轉(zhuǎn)頁(yè)面”為啥加雙引號(hào)西采，其實(shí)所謂的跳轉(zhuǎn)頁(yè)面可能和以前認(rèn)識(shí)的不太一樣。因?yàn)樵?code>Flutter里继控，所有能看到的東西一般都是widget械馆，但是胖眷，沒有說(shuō)那個(gè)app是由一個(gè)頁(yè)面構(gòu)成的，所以霹崎，這個(gè)概念確實(shí)還是有的珊搀。這個(gè)功能的實(shí)現(xiàn)需要用到兩個(gè)東西Route和Navigator。
Using the Navigator
Mobile apps typically reveal their contents via full-screen elements called "screens" or "pages". In Flutter these elements are called routes and they're managed by a Navigator widget. The navigator manages a stack of Route objects and provides methods for managing the stack, like Navigator.push and Navigator.pop.
班門弄斧的翻譯一下子：手機(jī)應(yīng)用們一般吧全屏的元素叫做“screens”或者“pages”尾菇。然而在Flutter里境析，我們叫做“routes”。它們用“Navigator”來(lái)管理错沽。Navigator管理了一個(gè)由Route組成的堆棧簿晓，并提供了一些方法方便去管理這個(gè)堆棧，比如說(shuō)：Navigator.push和Navigator.pop
Displaying a full-screen route
Although you can create a navigator directly, it's most common to use the navigator created by a WidgetsApp or a MaterialApp widget. You can refer to that navigator with Navigator.of.
A MaterialApp is the simplest way to set things up. The MaterialApp's home becomes the route at the bottom of the Navigator's stack. It is what you see when the app is launched.
盡管你可以直接創(chuàng)建一個(gè)navigator千埃，但是最常用的還是通過(guò)WidgetsApp和MaterialApp這兩個(gè)widget憔儿，你可以參考Navigator.of。
MaterialApp是最簡(jiǎn)單的一個(gè)方式放可。MaterialApp的home則會(huì)成為Navigator棧的底端谒臼，就是當(dāng)app剛啟動(dòng)的時(shí)候你看到的那個(gè)東西。eg：
void main() {
runApp(new MaterialApp(home: new MyAppHome()));
}
To push a new route on the stack you can create an instance of MaterialPageRoute with a builder function that creates whatever you want to appear on the screen. For example:
如果你想在棧里放一個(gè)新route的話耀里，你可以通過(guò)一個(gè)builder方法來(lái)創(chuàng)建一個(gè)MaterialPageRoute對(duì)象蜈缤。eg：
Navigator.push(context, new MaterialPageRoute<void>(
builder: (BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: new Text('My Page')),
body: new Center(
child: new FlatButton(
child: new Text('POP'),
onPressed: () {
Navigator.pop(context);
},
),
),
);
},
));
新的route通過(guò)Navigator的pop方法可以被出棧，返回app的首頁(yè)冯挎。
Navigator.pop(context);
The route defines its widget with a builder function instead of a child widget because it will be built and rebuilt in different contexts depending on when it's pushed and popped.
這個(gè)route之所以用builder方法來(lái)定義而不是直接用一個(gè)widget底哥，是因?yàn)樗谶M(jìn)出棧的時(shí)候需要根據(jù)不同的上下文來(lái)進(jìn)行構(gòu)建。
It usually isn't necessary to provide a widget that pops the Navigator in a route with a Scaffold because the Scaffold automatically adds a 'back' button to its AppBar. Pressing the back button causes Navigator.popto be called. On Android, pressing the system back button does the same thing.
通常情況下房官，如果用的是Scaffold的話趾徽，是不需要我們手動(dòng)去添加一個(gè)返回按鈕的。它會(huì)自動(dòng)的在左上角添加一個(gè)返回按鈕翰守，點(diǎn)擊這個(gè)返回按鈕就會(huì)調(diào)用Navigator.pop方法孵奶，在安卓上，按壓系統(tǒng)的返回按鈕效果是一樣的蜡峰。
Using named navigator routes 使用命好名的
routeMobile apps often manage a large number of routes and it's often easiest to refer to them by name. Route names, by convention, use a path-like structure (for example, '/a/b/c'). The app's home page route is named '/' by default.
app通常需要管理大量的route了袁，并且他們經(jīng)常很容易的通過(guò)名字來(lái)找到它們。route的名字湿颅，按照慣例载绿，用類似路徑的結(jié)構(gòu)（比如：‘a(chǎn)/b/c’）。app的首頁(yè)路徑默認(rèn)為'/'
The MaterialApp can be created with a
Map<String, WidgetBuilder>which maps from a route's name to a builder function that will create it. The MaterialApp uses this map to create a value for its navigator's onGenerateRoute callback.
MaterialApp創(chuàng)建的時(shí)候可以帶著一個(gè)Map油航，而這個(gè)Map描述了route的名字和對(duì)應(yīng)的builder方法崭庸。MaterialApp就是根據(jù)這個(gè)Map在navigator的onGenerateRoute回調(diào)里創(chuàng)建對(duì)應(yīng)的route
void main() {
runApp(new MaterialApp(
home: new MyAppHome(), // becomes the route named '/'
routes: <String, WidgetBuilder> {
'/a': (BuildContext context) => new MyPage(title: 'page A'),
'/b': (BuildContext context) => new MyPage(title: 'page B'),
'/c': (BuildContext context) => new MyPage(title: 'page C'),
},
));
}
個(gè)人認(rèn)為，這種寫法類似于Android里面清單文件的作用。
Navigator.pushNamed(context, '/b');
