路由
做Android/iOS原生開發(fā)的時候，要打開一個新的頁面，你得知道你的目標(biāo)頁面對象，然后初始化一個Intent或者ViewController，再通過startActivity或者pushViewController來推出一個新的頁面，不能跟web一樣，直接丟一個鏈接地址就跳轉(zhuǎn)到新的頁面。當(dāng)然，可以自己去加一個中間層來實現(xiàn)這些功能。
Flutter里面是原生支持路由的。Flutter的framework提供了路由跳轉(zhuǎn)的實現(xiàn)。我們可以直接使用這些功能。
Flutter路由介紹
Flutter里面有路由支持所有的路由場景，push、pop頁面，頁面間的參數(shù)傳遞等等。flutter里面的路由可以分成兩種，一種是直接注冊，不能傳遞參數(shù)。另一種要自己構(gòu)造實例，可以傳遞參數(shù)。我們暫時把它們規(guī)為靜態(tài)路由和動態(tài)路由。
跳轉(zhuǎn)
命名路由
在文件構(gòu)建時先設(shè)置路由參數(shù)：
new MaterialApp( // 代碼 routes: { "secondPage":(BuildContext context)=>new SecondPage(), },);在需要做路由跳轉(zhuǎn)的時候直接使用：
Navigator.pushNamed(context, "secondPage");
構(gòu)建路由
Navigator.push(context, new MaterialPageRoute(builder: (BuildContext context){ return new SecondPage();}))區(qū)別
以上兩種路由的優(yōu)缺點十分明顯：
動畫
構(gòu)建動畫
先在構(gòu)建一個動畫效果，如：
static SlideTransition createTransition( Animation<double> animation, Widget child) { return new SlideTransition( position: new Tween<Offset>( begin: const Offset(1.0, 0.0), end: const Offset(0.0, 0.0), ).animate(animation), child: child, );}以上動畫意思為跳轉(zhuǎn)時新頁面從右邊劃入，返回時向右邊劃出。
引入動畫
Navigator.push<String>( context, new PageRouteBuilder(pageBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) { // 跳轉(zhuǎn)的路由對象 return new Wechat(); }, transitionsBuilder: ( BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child, ) { return MyStatefulWidgetState .createTransition(animation, child); }))傳參
跳轉(zhuǎn)時
傳
前面我們說過，flutter的命名路由跳轉(zhuǎn)無法傳參。因此，我們只能使用構(gòu)建路由的方式傳參:
Navigator.push(context, new MaterialPageRoute(builder: (BuildContext context){ return new SecondPage( title:'此處為參數(shù)'， name:'此處為名字參數(shù)' );}))收
class SecondPage extends StatefulWidget { String title; String name; Wechat({ Key key, this.title, this.name }) : super(key: key); @override State<StatefulWidget> createState() { return new MyStatefulWidgetState(); }}返回時
傳
當(dāng)觸發(fā)路由返回的事件時，傳參是十分簡單的。和跳轉(zhuǎn)時的方式一樣，甚至更簡單，只需要：
Navigator.of(context).pop('這個是要返回給上一個頁面的數(shù)據(jù)');收
但是，在接受返回時的數(shù)據(jù)需要改造前面觸發(fā)跳轉(zhuǎn)時的路由：
// 命名路由Navigator.pushNamed<String>(context, "ThirdPage").then( (String value){ //處理代碼});// 構(gòu)建路由Navigator.push<String>(context, new MaterialPageRoute(builder: (BuildContext context){ return new ThirdPage(title:"請輸入昵稱");})).then( (String result){ //處理代碼});以上就是Flutter路由的跳轉(zhuǎn)、動畫以及傳參的相關(guān)方法，依葫蘆畫瓢即可輕松應(yīng)對。
總結(jié)
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，如果有疑問大家可以留言交流，謝謝大家對VEVB武林網(wǎng)的支持。
新聞熱點
疑難解答
