✨App共通SnackBar - Ki-Kobayashi/flutter_wiki GitHub Wiki
🟩 SnackBarの作成と設定
🟡 AppSnackbarの作成
// 👇以下忘れずに!
final rootScaffoldMessengerKey = GlobalKey<ScaffoldMessengerState>();
class AppSnackBar {
  static ScaffoldFeatureController<SnackBar, SnackBarClosedReason>
      buildSnackBar({
    required String content,
    bool isErrorSnackBar  = false,
  }) {
    return rootScaffoldMessengerKey.currentState!.showSnackBar(
      SnackBar(
        margin: const EdgeInsets.all(16.0),
        behavior: SnackBarBehavior.floating,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(8.0),
        ),
        backgroundColor: isErrorSnackBar ? ConstColor.backgroundErrSnackbar : null,
        content: Text(
          content,
        ),
      ),
    );
  }
}
◆別解(Riverpod使用例だが、無理に使用しなくても良さそう).
// 👇以下忘れずに!
@Riverpod(keepAlive: true)
GlobalKey<ScaffoldMessengerState> scaffoldMessengerKey(
  ScaffoldMessengerKeyRef ref,
) {
  return GlobalKey<ScaffoldMessengerState>();
}
class AppSnackBar {
  static ScaffoldFeatureController<SnackBar, SnackBarClosedReason>
      buildSnackBar({
    required String text,
    Color? backgroundColor,
  }) {
    // 👇以下の方法を取る場合は、main.dart・MaterialApp.router(scaffoldMessengerKey:ref.watch(scaffoldMessengerKeyProvider),を指定する
    return ref.read(scaffoldMessengerKeyProvider).currentState!.showSnackBar(
      SnackBar(
        margin: const EdgeInsets.all(16.0),
        behavior: SnackBarBehavior.floating,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(8.0),
        ),
        backgroundColor: backgroundColor,
        content: Text(
          text,
        ),
      ),
    );
  }
}
.
🟡 application.dart
@override
  Widget build(BuildContext context) {
    final goRouter = ref.watch(routerProvider);
    return MaterialApp.router(
      scaffoldMessengerKey: rootScaffoldMessengerKey, 👈コッチの方がわかりやすい
      scaffoldMessengerKey: ref.watch(scaffoldMessengerKeyProvider, 👈別解
      ...
.
🟩使い方
表示させたいタイミングで、以下を呼び出す
AppSnackBar.buildSnackBar(
  content: errMessage,
  isErrorSnackBar: true,
);
.
🟩
🟡
.
🟩
🟡
.
🟩
🟡
.
🟩
🟡
.
🟩
🟡
.
🟩
🟡
.
🟩
🟡
.