【Flutter】ボタン・ナビゲーションバーで画面遷移（ページ移動）

Flutterで画面遷移させる方法とサンプルコードを紹介します。

【画面遷移】画面下部にタブを設置

Flutterの画面遷移は、ウィジェットをスタックで管理できる「Navigator」を使用します。

ホーム画面からその他画面、またその他画面への遷移し戻ることが出来るようにする場合は、次の画面への遷移にpush、画面を戻るときはpopを使用します。
（pushされた画面でpopできれば元の画面に戻ることができます）
能であれば、バックオペレーションが可能になります。※アクションバーの戻るボタ

  Navigator.of(context).pushNamed("/next");

スタックされた画面から、画面をクリアしてホーム画面へ戻りたい場合は、popUntil を使用します。　popUntil は条件に一致するまでスタックから画面をpopします。

  Navigator.popUntil(context, ModalRoute.withName("/home"));

第二引数の predicate にPopを止めたい条件を指定します。
ダイアログを表示する場合は、showDialogを使用します。
showDialog の内部コードでは、push が呼ばれています。ダイアログを閉じる場合は、pop を使用します。

■main.dart

■screens/home_page.dart

■screens/setting_page.dart

画面下部にあるナビゲーションバーのことを、ボトムナビゲーションバー（bottomNavigationBar）といいます。
Scaffoldで指定してやり、onTapは引数としてタップされたボタンの数値（index）を持っているので、それを元に画面遷移を実装します。