Flutterで、名前を使って画面遷移する
最終更新日:2019-05-02
Flutterでは、WebのURLのように名前を使って画面遷移することもできます。ヘルプページのような、遷移元がたくさんあるような場面で使うとよいでしょう。
遷移先となるWidgetはこちらを参照してください。
名前とWidgetの対応を設定する
名前と画面(Widget)の対応は MaterialApp
の routes
に記述します。
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.amber,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
routes: <String, WidgetBuilder> {
'/next': (BuildContext context) => NextPage(),
},
);
}
画面遷移する
名前で画面遷移をするには、 Navigator.pushNamed()
を使用します。
// FABの部分だけ記述
FloatingActionButton(
onPressed: () => Navigator.pushNamed(this.context, '/next'),
tooltip: 'Next',
child: Icon(Icons.arrow_right),
)