如何在容器底部显示 Snackbar 而不是屏幕颤动

Question

我有下面的屏幕来实现，我遇到的问题是我不知道如何在容器底部显示小吃栏。它在屏幕底部显示小吃栏，但我希望它如下所示：

注意：图片中的 Snackbar 显示有文字“Whoray, Right Answer”。

添加代码：

SingleChildScrollView(
      child: BlocBuilder<QuizControllerCubit, QuizControllerState>(
        builder: (context, state) {
          if (state is OnWrongAnswerGiven) {
            SnackBarCustomWidget.showSnackBar(
              context,
              SnackBarWidget.getSnackBar(context, state.message),
            );
          } else if (state is OnRightAnswerGiven) {
            SnackBarCustomWidget.showSnackBar(
              context,
              SnackBarWidget.getSnackBar(context, state.message),
            );
          }
          return SnackBarCustomWidget(
            child: Builder(
              builder: (context) => Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  QuizTitleWidget(title: question.name),
                  Container(
                    constraints: BoxConstraints(
                      minHeight: MediaQueryUtils(context).height * 0.5,
                      maxHeight: MediaQue

Answer 1

让我给你一个小部件

class MySnackBarStack extends StatefulWidget {
  final Widget child;

  const MySnackBarStack({Key key, this.child}) : super(key: key);
  @override
  _MySnackBarStackState createState() => _MySnackBarStackState();

  static void showSnackBar(BuildContext context,SnackBar snackBar){
    context.findAncestorStateOfType<_MySnackBarStackState>()._showSnackBar(snackBar);
  }

  static void hideSnackBar(BuildContext context){
    context.findAncestorStateOfType<_MySnackBarStackState>()._hideSnackBar();
  }
}

class _MySnackBarStackState extends State<MySnackBarStack> {
  Widget snackBar = SizedBox();

  void _showSnackBar(SnackBar snackBar){
    setState(() {
      this.snackBar = snackBar;
    });
  }

  void _hideSnackBar(){
    setState(() {
      snackBar = SizedBox();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        widget.child,
        snackBar,
      ],
    );
  }
}

现在在任何构建方法中都像这样使用它

//you cannot access MySnackBarStack here and up
MySnackBarStack(
    child: Builder(
      //you can only access MySnackBarStack here and down
      builder: (newContext){
        return MyContainer(
          onTap:(){
            MySnackBarStack.showSnackBar(newContext, snackBar);
          }
        );
      },
    ),
  )