[Flutter]トースト(toast)を表示するには？

どうも、ちょげ(@chogetarou)です。

Flutterでトーストを表示する方法を紹介します。

方法
使用例

方法

Flutterでトーストを表示するには、SnackBarを使います。

まず、トーストを表示したいタイミングで、ScaffoldMessenger.of(context).showSnackBar()を呼び出します。

そして、showSnackBarの引数にSnackBarを指定します。

あとは、SnackBarの引数「content」に表示するテキストを指定します。

ScaffoldMessenger.of(context).showSnackBar(
  SnackBar(
    content: Text('テキスト'),
  ),
);

showSnackBarが呼ばれた段階で、トーストが表示されます。

使用例

以下は、使用例です。

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              ScaffoldMessenger.of(context).showSnackBar(
                SnackBar(
                  content: Text('Snack Message'),
                ),
              );
            },
            child: Text('Show'),
          ),
        ),
      ),
    );
  }