WidgetsAppを使用したアプリケーションナビゲーションの例

Question

私のアプリケーションのナビゲーションを宣言しようとしています。 MaterialAppラッパーやスタイリングを使用していないため、すべて私の輸入品はpackage:flutter/widgets.dartです。ドキュメントを1として

は、適切に私は、このやっているナビゲーションを使用します

import "package:flutter/widgets.dart"; 
import "package:myapp/routes/home.dart"; 

void main() { 
    runApp(
    new WidgetsApp(/* stuck here */); 
) 
} 

そして、私はこの段階で立ち往生していますが、私はIDEでNavigator docsとコードのコメントに従うことをしようとしていますが、私は理解できませんどのように使用onGenerateRouteWidgetsAppのプロパティを使用して、このオンライン、したがって質問の完全な例を見つけることができません。

new MaterialApp()と同様に、ホームパスと残りのルートをnew WidgetsApp()に定義するにはどうすればよいですか？これにフォローアップ質問として

、私はその後、switch文は、ルートと表示ページをチェックしていレイアウトにルーティングするために何とかnew WidgetsApp()内/onboarding/**または/dashboard/**のようなワイルドカードのルートを使用してさせていただいておりますか！

Answer 1

onGenerateRouteプロパティを使用すると、ウィジェットアプリのルートを生成できます。ここで

は同じの非常に最小限の実装です：

import 'package:flutter/widgets.dart'; 

void main() => runApp(new MyWidgetsApp()); 

class MyWidgetsApp extends StatelessWidget { 

    Route generate(RouteSettings settings){ 
    Route page; 
    switch(settings.name){ 
     case "/": 
     page = new PageRouteBuilder(
      pageBuilder: (BuildContext context,Animation<double> animation, 
       Animation<double> secondaryAnimation){ 
       return new Column(
       mainAxisAlignment: MainAxisAlignment.center, 
       children: <Widget>[ 
        const Text("Home Page",textDirection: TextDirection.ltr,), 
        const Padding(padding: const EdgeInsets.all(10.0)), 
        new GestureDetector(
        onTap:() => Navigator.of(context).pushNamed("/first"), 
        child: new Container(
         padding: const EdgeInsets.all(10.0), 
         color:Colors.blue, 
         child: const Text("Go to First Page"), 
        ), 
       ), 
        const Padding(padding: const EdgeInsets.all(10.0)), 
        new GestureDetector(
        onTap:() => Navigator.of(context).pushNamed("/abcd"), 
        child: new Container(
         padding: const EdgeInsets.all(10.0), 
         color:Colors.blue, 
         child: const Text("Unkown Route"), 
        ), 
       ) 
       ], 
      ); 
      }, 
      transitionsBuilder: (_, Animation<double> animation, Animation<double> second, Widget child) { 
       return new FadeTransition(
       opacity: animation, 
       child: new FadeTransition(
        opacity: new Tween<double>(begin: 1.0, end: 0.0).animate(second), 
        child: child, 
       ), 
      ); 
      } 
     ); 
     break; 
     case "/first": 
     page = new PageRouteBuilder(
      pageBuilder: (BuildContext context,Animation<double> animation, 
       Animation<double> secondaryAnimation){ 
       return new Column(
        mainAxisAlignment: MainAxisAlignment.center, 
        children: <Widget>[ 
        const Text("First Page",textDirection: TextDirection.ltr,), 
        const Padding(padding: const EdgeInsets.all(10.0)), 
        new GestureDetector(
         onTap:() => Navigator.of(context).pop(), 
         child: new Container(
         padding: const EdgeInsets.all(10.0), 
         color:Colors.blue, 
         child: const Text("Back"), 
        ), 
        ) 
        ] 
      ); 
      }, 
      transitionsBuilder: (_, Animation<double> animation, Animation<double> second, Widget child) { 
       return new FadeTransition(
       opacity: animation, 
       child: new FadeTransition(
        opacity: new Tween<double>(begin: 1.0, end: 0.0).animate(second), 
        child: child, 
       ), 
      ); 
      } 
     ); 
     break; 
    } 
    return page; 
    } 

    Route unKnownRoute(RouteSettings settings){ 
    return new PageRouteBuilder(
     pageBuilder: (BuildContext context,Animation<double> animation, 
      Animation<double> secondaryAnimation){ 
      return new Column(
       mainAxisAlignment: MainAxisAlignment.center, 
       children: <Widget>[ 
       const Text("First Page",textDirection: TextDirection.ltr,), 
       const Padding(padding: const EdgeInsets.all(10.0)), 
       new GestureDetector(
        onTap:() => Navigator.of(context).pop(), 
        child: new Container(
        padding: const EdgeInsets.all(10.0), 
        color:Colors.blue, 
        child: const Text("Back"), 
       ), 
       ) 
       ] 
     ); 
     } 
    ); 
    } 

    @override 
    Widget build(BuildContext context) { 
    return new WidgetsApp(
     onGenerateRoute: generate, 
     onUnknownRoute: unKnownRoute, 
     textStyle: const TextStyle(), 
     initialRoute: "/", 
     color: Colors.red 
    ); 
    } 
} 

助けを願っています！