Scaffold.of () вызывается с контекстом, не содержащим Scaffold

Это исключение происходит из-за того, что вы используете context виджета, который создал экземпляр Scaffold. Не context ребенка Scaffold.

Вы можете решить эту проблему, просто используя другой контекст:

Scaffold(
    appBar: AppBar(
        title: Text('SnackBar Playground'),
    ),
    body: Builder(
        builder: (context) => 
            Center(
            child: RaisedButton(
            color: Colors.pink,
            textColor: Colors.white,
            onPressed: () => _displaySnackBar(context),
            child: Text('Display SnackBar'),
            ),
        ),
    ),
);

Обратите внимание, что хотя мы здесь используем Builder, это не единственный способ получить другой BuildContext.

Также возможно извлечь поддерево в другой Widget (обычно с помощью рефакторинга extract widget)

Вы можете использовать GlobalKey. Единственным недостатком является то, что использование GlobalKey может быть не самым эффективным способом сделать это.

Хорошо то, что вы также можете передать этот ключ другому классу настраиваемых виджетов, который не содержит никаких каркасов. См. (здесь)

class HomePage extends StatelessWidget {
  final _scaffoldKey = GlobalKey<ScaffoldState>(); \\ new line
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,                           \\ new line
      appBar: AppBar(
        title: Text('SnackBar Playground'),
      ),
      body: Center(
        child: RaisedButton(
          color: Colors.pink,
          textColor: Colors.white,
          onPressed: _displaySnackBar(context),
          child: Text('Display SnackBar'),
        ),
      ),
    );
  }
  _displaySnackBar(BuildContext context) {
    final snackBar = SnackBar(content: Text('Are you talkin\' to me?'));
    _scaffoldKey.currentState.showSnackBar(snackBar);   \\ edited line
  }
}

Вы можете решить эту проблему двумя способами:

1) Использование виджета Builder

Scaffold(
    appBar: AppBar(
        title: Text('My Profile'),
    ),
    body: Builder(
        builder: (ctx) => RaisedButton(
            textColor: Colors.red,
            child: Text('Submit'),
            onPressed: () {
                 Scaffold.of(ctx).showSnackBar(SnackBar(content: Text('Profile Save'),),);
            }               
        ),
    ),
);

2) Использование GlobalKey

class HomePage extends StatelessWidget {
  
  final globalKey = GlobalKey<ScaffoldState>();
  
  @override
  Widget build(BuildContext context) {
     return Scaffold(
       key: globalKey,
       appBar: AppBar(
          title: Text('My Profile'),
       ),
       body:  RaisedButton(
          textColor: Colors.red,
          child: Text('Submit'),
          onPressed: (){
               final snackBar = SnackBar(content: Text('Profile saved'));
               globalKey.currentState.showSnackBar(snackBar);
          },
        ),
     );
   }
}

ОБНОВЛЕНИЕ - 2021

Scaffold.of(context) устарел в пользу ScaffoldMessenger.

Проверьте это в документации метода:

ScaffoldMessenger теперь обрабатывает SnackBars, чтобы они сохранялись на разных маршрутах и ​​всегда отображались в текущем Scaffold. По умолчанию корневой ScaffoldMessenger включен в MaterialApp, но вы можете создать свою собственную контролируемую область для ScaffoldMessenger, чтобы в дальнейшем контролировать, какие скаффолды получают ваши SnackBars.

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('Demo')
    ),
    body: Builder(
      // Create an inner BuildContext so that the onPressed methods
      // can refer to the Scaffold with Scaffold.of().
      builder: (BuildContext context) {
         return Center(
          child: RaisedButton(
            child: Text('SHOW A SNACKBAR'),
            onPressed: () {
              ScaffoldMessenger.of(context).showSnackBar(SnackBar(
                content: Text('Hello!'),
              ));
            },
          ),
        );
      },
    ),
  );
}

Подробную информацию об устаревании и новом подходе можно найти здесь:

Простым способом решения этой проблемы будет создание ключа для вашего каркаса, подобного этому финальному, с помощью следующего кода:

Первый: GlobalKey<ScaffoldState>() _scaffoldKey = GlobalKey<ScaffoldState> ();

Второй: назначьте ключ к эшафоту key: _scaffoldKey

В-третьих: вызовите Snackbar, используя _scaffoldKey.currentState.showSnackBar(SnackBar(content: Text("Welcome")));

ОБНОВЛЕНИЕ 03.03.2021: Только что вышел Flutter 2.0 ...

(Что касается исторической ценности, я также приведу ниже свой исходный ответ ...)

Теперь ... Enter ...

ScaffoldMessenger

Из документа мы читаем

SnackBar API в Scaffold теперь обрабатывается ScaffoldMessenger, один из которых доступен по умолчанию в контексте MaterialApp.

Итак, используя новый ScaffoldMessenger, теперь вы сможете писать такой код, как

Scaffold(
  key: scaffoldKey,
  body: GestureDetector(
    onTap: () {
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(
        content: const Text('snack'),
        duration: const Duration(seconds: 1),
        action: SnackBarAction(
          label: 'ACTION',
          onPressed: () { },
        ),
      ));
    },
    child: const Text('SHOW SNACK'),
  ),
);

Теперь снова в документе мы видим, что

При представлении SnackBar во время перехода SnackBar завершит анимацию Hero, плавно переходя на следующую страницу.

ScaffoldMessenger создает область, в которой все дочерние скаффолды регистрируются для получения SnackBars, и именно так они сохраняются при этих переходах. При использовании корневого ScaffoldMessenger, предоставляемого MaterialApp, все дочерние скаффолды получают SnackBars, если только дальше по дереву не создается новая область ScaffoldMessenger. Создавая собственный ScaffoldMessenger, вы можете контролировать, какие скаффолды получают SnackBars, а какие нет, в зависимости от контекста вашего приложения.

ОРИГИНАЛЬНЫЙ ОТВЕТ

Само поведение, с которым вы столкнулись, даже упоминается как сложный случай в Flutter документация.

Как исправить

Проблема устраняется по-разному, как вы можете видеть из других ответов, размещенных здесь. Например, часть документации, на которую я ссылаюсь, решает проблему с помощью Builder, который создает

внутренний BuildContext, так что onPressed методы могут ссылаться на Scaffold с помощью Scaffold.of().

Таким образом, вызов showSnackBar из Scaffold будет

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: Text('Demo')),
    body: Builder(
      builder: (BuildContext innerContext) {
        return FlatButton(
          child: Text('BUTTON'),
          onPressed: () {
            Scaffold.of(innerContext).showSnackBar(SnackBar(
              content: Text('Hello.')
            ));
          }
        );
      }
    )
  );
}

Теперь немного подробностей для любознательного читателя.

Я сам нашел весьма поучительным изучить документацию Flutter, просто установив (Android Studio) курсор на фрагмент кода (Flutter класс, метод и т. д.) и нажмите ctrl + B, чтобы отобразить документацию для этого конкретного элемента.

Конкретная проблема, с которой вы столкнулись, упоминается в документе для BuildContext, где можно прочитать

Каждый виджет имеет свой собственный BuildContext, который становится родительским для виджета, возвращаемого функцией [...]. Build.

Итак, это означает, что в нашем случае context будет родительским элементом нашего виджета Scaffold при его создании (!). Кроме того, в документе Scaffold.of говорится, что он возвращает

Состояние из ближайшего экземпляра [Scaffold] этого класса, который включает данный контекст.

Но в нашем случае context не включает (пока) Scaffold (он еще не построен). Здесь в дело вступает Builder!

И снова документ освещает нас. Там мы можем прочитать

[Класс Builder - это просто] Платонический виджет, который вызывает закрытие для получения своего дочернего виджета.

Эй, погоди, что ?! Хорошо, я признаю: это не очень помогает ... Но достаточно сказать (после другой поток SO), который

Назначение класса Builder - просто создавать и возвращать дочерние виджеты.

Итак, теперь все становится ясно! Вызывая Builder внутри Scaffold, мы создаем Scaffold, чтобы иметь возможность получить его собственный контекст, и, вооружившись этим innerContext, мы, наконец, можем вызовите Scaffold.of (innerContext)

Аннотированная версия приведенного выше кода следует

@override
Widget build(BuildContext context) {
  // here, Scaffold.of(context) returns null
  return Scaffold(
    appBar: AppBar(title: Text('Demo')),
    body: Builder(
      builder: (BuildContext innerContext) {
        return FlatButton(
          child: Text('BUTTON'),
          onPressed: () {
            // here, Scaffold.of(innerContext) returns the locally created Scaffold
            Scaffold.of(innerContext).showSnackBar(SnackBar(
              content: Text('Hello.')
            ));
          }
        );
      }
    )
  );
}

Используйте ScaffoldMessenger (рекомендуется)

var snackBar = SnackBar(content: Text('Hi there'));
ScaffoldMessenger.of(context).showSnackBar(snackBar);

Пример (без Builder или GlobalKey)

Scaffold(
  body: ElevatedButton(
    onPressed: () {
      var snackBar = SnackBar(content: Text('Hello World'));
      ScaffoldMessenger.of(context).showSnackBar(snackBar);
    },
    child: Text('Show SnackBar'),
  ),
)

Начиная с Flutter версии 1.23-18.1.pre, вы можете использовать ScaffoldMessenger.

final mainScaffoldMessengerKey = GlobalKey<ScaffoldMessengerState>();

class Main extends StatelessWidget {
  @override
  Widget build(BuildContext) {
    return MaterialApp(
      ...
      scaffoldMessengerKey: mainScaffoldMessengerKey
      ...
    );
  }
}

Где-то внутри приложения:

mainScaffoldMessengerKey.currentState.showSnackBar(Snackbar(...));

Более эффективное решение - разделить вашу функцию сборки на несколько виджетов. Это вводит «новый контекст», из которого вы можете получить Scaffold

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Scaffold.of example.')),
        body: MyScaffoldBody(),
      ),
    );
  }
}

class MyScaffoldBody extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: RaisedButton(
          child: Text('Show a snackBar'),
          onPressed: () {
            Scaffold.of(context).showSnackBar(
              SnackBar(
                content: Text('Have a Snack'),
              ),
            );
          }),
    );
  }
}

Я бы не стал использовать закусочную по умолчанию, потому что вы можете импортировать пакет флешбара, который обеспечивает большую настраиваемость:

https://pub.dev/packages/flushbar

Например:

Flushbar(
                  title:  "Hey Ninja",
                  message:  "Lorem Ipsum is simply dummy text of the printing and typesetting industry",
                  duration:  Duration(seconds: 3),              
                )..show(context);

Я могу опоздать. Но и это кому-то поможет. Добавьте _key под каркасом. Затем используйте этот _key для вызова метода openDrawer.

return Scaffold(
  key: _scaffoldKey, //this is the key
  endDrawer: Drawer(),
  appBar: AppBar( 
//all codes for appbar here
actions: [
IconButton(
        splashRadius: 20,
        icon: Icon(Icons.settings),
        onPressed: () {
          _scaffoldKey.currentState.openEndDrawer(); // this is it
       
        },
      ),]

Извлеките виджет кнопки, который будет отображать снэк-бар.

class UsellesslyNestedButton extends StatelessWidget {
  const UsellesslyNestedButton({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: (){
        showDefaultSnackbar(context);
                    },
                    color: Colors.blue,
                    child: Text('Show about'),
                  );
  }
}

здесь мы используем конструктор, чтобы обернуть другой виджет, где нам нужна закусочная

Builder(builder: (context) => GestureDetector(
    onTap: () {
        Scaffold.of(context).showSnackBar(SnackBar(
            content: Text('Your Services have been successfully created Snackbar'),
        ));
        
    },
    child: Container(...)))

Может, в этом коде есть решение.

ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text("SnackBar Message")));

Попробуйте этот код:

Singleton.showInSnackBar(
    Scaffold.of(context).context, "Theme Changed Successfully");
// Just use Scaffold.of(context) before context!!