在 Flutter 中显示 Snackbar 时向上移动底部对齐的小部件

Question

这是我面临的一个简单问题

class SO extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Align(
        alignment: Alignment.bottomCenter,
        child: Builder(
          builder: (BuildContext context) {
            return RaisedButton(
              onPressed: () => _showSnackbar(context),
              child: Text("show snackbar"),
            );
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
      ),
    );
  }

  void _showSnackbar(BuildContext context) {
    Scaffold.of(context)
      ..hideCurrentSnackBar()
      ..showSnackBar(SnackBar(
        content: Text("this is snackbar"),
      ));
  }
}

当显示

Snackbar

时，

FloatingActionButton

向上移动，但

RaisedButton

隐藏在

Snackbar

后面。如何使

Snackbar

在显示时不覆盖任何小部件？在 Android 中，我可以使用

CoordinatorLayout

。我应该在这里做什么？

Answer 1

试试这个。

这是下面提到的代码的输出：观看视频

class SomeScreen extends StatelessWidget {
  const SomeScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: const SafeArea(child: SizedBox()),
      floatingActionButton: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 32),
            child: ElevatedButton(
              onPressed: () {
                _showSnackbar(context);
              },
              child: const Text("Show snackbar"),
            ),
          ),
          FloatingActionButton(
            onPressed: () {},
          ),
        ],
      ),
    );
  }

  void _showSnackbar(BuildContext context) {
    ScaffoldMessenger.of(context).hideCurrentSnackBar();
    const SnackBar snackbar = SnackBar(content: Text("See, snackbar here!"));
    ScaffoldMessenger.of(context).showSnackBar(snackbar);
    return;
  }
}