flutter - 在可见的抽屉菜单上方显示 Flutter 的 SnackBar？

Question

我有一个 Scaffold用一个简单的 Drawer其中我显示了一个菜单，用户可以在其中按下按钮。当按下这个按钮时，我想显示一个 SnackBar ，但 SnackBar 总是显示在 Drawer 后面。有没有办法在抽屉前展示它？

抽屉的代码如下所示:

class MyDrawer extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        children: <Widget>[
          ListTile(
            leading: Icon(Icons.lock_open),
            title: Text('Click Me'),
            onTap: () {
              Scaffold.of(context).showSnackBar(SnackBar(
                  content: Text(
                'Test.',
              )));
            },
          ),
        ],
      ),
    );
  }
}

并且直接在 Scaffold 中使用:

    return Scaffold(
        drawer: MyDrawer(),
        [...]

Answer 1

他们说，在 MaterialDesign 规则下，Drawer 必须位于 UI 的顶部。但是如果你太想要这种行为，你可以编写自己的 SnackBar。

static void showSnackBarAsBottomSheet(BuildContext context, String message) 
{
    showModalBottomSheet<void>(
      context: context,
      barrierColor: const Color.fromRGBO(0, 0, 0, 0),
      builder: (BuildContext context) {
        Future.delayed(const Duration(seconds: 5), () {
          try {
            Navigator.pop(context);
          } on Exception {}
        });
        return Container(
            color: Colors.grey.shade800,
            padding: const EdgeInsets.all(12),
            child: Wrap(children: [
              Text(
                message,
                style:
                    GoogleFonts.robotoCondensed().copyWith(color: Colors.white),
              )
            ]));
      },
    );
  }