0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Navigator.popで前の画面に遷移した時に、SnackBarなどで完了を表示する方法

Posted at

※完全に備忘録です。記事のクオリティには期待しないでください。笑

#Navigator.popで画面遷移した後に、SnackBarで完了を表示するには

Screen Recording 2022-02-18 at 18.49.44.gif

これを作るときににはSnackBarのコードはNavigator.pushのコード内に記述します。
「なんで前の画面に記述するの?」「Navigator.popの中じゃないの?」
って自分で思い、自分なりの理解をしたので備忘録として残しておきます。

なぜNavigator.pushの中に記載するのか

今回参考にさせて頂いたのはYouTubeチャンネル「Flutter大学」の中のコードです。

Navigator.pushが含まれているコード

return FloatingActionButton(
          onPressed: () async {
            final bool? added = await Navigator.push(
              //画面遷移させる
              context,
              MaterialPageRoute(
                builder: (context) => AddBookPage(),
                //遷移先を指定
              ),
            );
            //▲ここで一旦処理が止まる

            //▼Navigator.popで帰ってきた時に残りのコードが呼び出される
            if(added != null && added){
              final snackBar = SnackBar(
                content: Text('本の入力を完了しました'),
                backgroundColor: Colors.green,
              );
              ScaffoldMessenger.of(context).showSnackBar(snackBar);
            }
            model.fetchBookList();
          },
          tooltip: 'Increment',
          child: Icon(Icons.add),
          );

Navigator.pop(今回はNavigator.of(context).pop();のコード)

 onPressed: () async {
    try {
    await model.addBook();
    Navigator.of(context).pop(true);
    } catch(e){
    final snackBar = SnackBar(
         content: Text(e.toString())
    );
    ScaffoldMessenger.of(context).showSnackBar(snackBar);
    }
    },
    child: Text('追加する')

#なんでpushの中じゃないの?
※あくまで個人的な捉え方です。

Navigator.pushで画面遷移した時に、遷移する前のコードの処理はその場で1時的にストップします。なので、popで戻ってきた時に遷移前に処理した部分からまた処理が再開されるので、if(added != null, added)のコードから再開されるというわけです。

popの中じゃダメなの?

1つの画面には1つのdartファイルが当てはめられているため、遷移前の画面のプログラムには書いても遷移後の画面に反映されないので、遷移後のDartファイルに記載することになります。

初投稿なので、文章の適当さ加減は勘弁してください。汗

これからもアウトプットとして書いていきたいと思います!!

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?