在动态脚手架中显示 SnackBar 失败

Question

I have a Home widget with a build method that returns either a Scaffold or a loader widget, based on a boolean. The boolean is set to false, so I return the Scaffold first. I then have a button inside that Scaffold (inside a builder so it will get the Scaffold context for the SnackBar) which changes the bool to true (and as a result returns the loader widget) and after evaluating an input, sets the bool back to false, causing the Scaffold to be returned.

Within that onPressed() function I also have a SnackBar which I would like to show, but fails with the following error message:

Looking up a deactivated widget's ancestor is unsafe. At this point the state of the widget's element tree is no longer stable. To safely refer to a widget's ancestor in its dispose() method, save a reference to the ancestor by calling dependOnInheritedWidgetOfExactType() in the widget's didChangeDependencies() method.

(I guess that when I'm returning the loader widget and then returning the Scaffold, something got messed up with the context, I assume the Scaffold returned is a new one, but I am not sure)

The entire Widget class:

class _HomeState extends State<Home> {
  bool loading = false;
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    return loading
        ? Loading()
        : Scaffold(
            key: _scaffoldKey,
            // backgroundColor: Colors.deepPurple[100],
            appBar: AppBar(
              title: Text(
                'netlush.co.il/home',
                style: TextStyle(
                  fontWeight: FontWeight.w100,
                  fontSize: 16.0,
                ),
              ),
            ),
            body: Padding(
              padding: const EdgeInsets.only(top: 16.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Builder(
                    builder: (context) => RaisedButton(
                      onPressed: () async {
                        setState(() => loading = true);
                        List<UserModel> users = await Api().getCustomers();
                        users = null;
                        if (users == null) {
                          setState(() {
                            loading = false;
                            print('users list is empty');
                            Scaffold.of(context).showSnackBar(SnackBar(
                              content: Text('Context from Builder'),
                              duration: Duration(seconds: 3),
                            ));
                          });
                        } else {
                          setState(() => loading = false);
                          // navigate to users page
                          Navigator.pushNamed(context, '/users',
                              arguments: {'users': users});
                        }
                      },
                      child: Text('Clients*'),
                    ),
                  ),
                  RaisedButton(
                    onPressed: () {},
                    child: Text('Payments'),
                  ),
                ],
              ),
            ),
          );
  }
}

*the user=null statement is there for debugging purposes.

Appreciate your help.

Answer 1

You can copy paste run full code below
You can use addPostFrameCallback code snippet

WidgetsBinding.instance.addPostFrameCallback((_) {
                            _scaffoldKey.currentState.showSnackBar(SnackBar(
                              content: Text('Context from Builder'),
                              duration: Duration(seconds: 3),
                            ));
                          });

working demo

full code

import 'package:flutter/material.dart';

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  bool loading = false;
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    return loading
        ? Center(child: CircularProgressIndicator())
        : Scaffold(
            key: _scaffoldKey,
            // backgroundColor: Colors.deepPurple[100],
            appBar: AppBar(
              title: Text(
                'netlush.co.il/home',
                style: TextStyle(
                  fontWeight: FontWeight.w100,
                  fontSize: 16.0,
                ),
              ),
            ),
            body: Padding(
              padding: const EdgeInsets.only(top: 16.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Builder(
                    builder: (context) => RaisedButton(
                      onPressed: () async {
                        setState(() => loading = true);
                        //List<UserModel> users = await Api().getCustomers();
                        await Future.delayed(Duration(seconds: 3), () {});

                        var users;
                        users = null;
                        if (users == null) {
                          setState(() {
                            loading = false;
                            print('users list is empty');
                          });

                          WidgetsBinding.instance.addPostFrameCallback((_) {
                            _scaffoldKey.currentState.showSnackBar(SnackBar(
                              content: Text('Context from Builder'),
                              duration: Duration(seconds: 3),
                            ));
                          });
                        } else {
                          setState(() => loading = false);
                          // navigate to users page
                          Navigator.pushNamed(context, '/users',
                              arguments: {'users': users});
                        }
                      },
                      child: Text('Clients*'),
                    ),
                  ),
                  RaisedButton(
                    onPressed: () {},
                    child: Text('Payments'),
                  ),
                ],
              ),
            ),
          );
  }
}

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Home(),
    );
  }
}