facebook twitter hatena line email

「Flutter/画面遷移」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(その2)
(その2)
行33: 行33:
 
));
 
));
 
</pre>
 
</pre>
 +
 +
==元の画面に戻る==
 +
Navigator.pop(context);
  
 
==参考==
 
==参考==
 
https://qiita.com/tatsu/items/38cd85efd93005b95af9
 
https://qiita.com/tatsu/items/38cd85efd93005b95af9

2019年4月28日 (日) 16:29時点における版

画面遷移サンプル

その1

routerをMyAppの中に追加

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
      routes: <String, WidgetBuilder> {
        '/help': (BuildContext context) => new MyHomePage(title: 'page help'),
        '/privacy': (BuildContext context) => new MyHomePage(title: 'page privacy'),
        '/use': (BuildContext context) => new MyHomePage(title: 'page use'),
      },
    );
  }
}

画面遷移

Navigator.of(context).pushNamed('/use');

その2

router&画面遷移

Navigator.push(context, new MaterialPageRoute<Null>(
    settings: const RouteSettings(name: "/use"),
    builder: (BuildContext context) => MyHomePage(title: 'page use')
));

元の画面に戻る

Navigator.pop(context);

参考

https://qiita.com/tatsu/items/38cd85efd93005b95af9