如何在代码延迟后删除 showdialog 可见性

How to remove showdialog visibility after code delay

我在代码延迟 1 秒后将 _visible 设置为 false,但对话框仍保留在屏幕上。我等待对话框在一秒钟后消失。我该如何设置?

                 return BuildNumButton(
                          buttonColorDisable: _buttonColorRed(),
                          color: colorList[index],
                          number: numberList[index],
                          isDisable: disableButtons.contains(index),
                          callback: () async {
                            disableButtons.add(index);

                            CalculateScore.sumNumbers(numberList[index]);
                            CalculateScore.calculateScore();
                            _updateScore();
                            if (CalculateScore.answer) {
                              if (!CalculateScore.endGame) {
                                _show();

                                await Future.delayed(
                                    const Duration(milliseconds: 1000), () {
                                  setState(() {
                                    _visible = !_visible;
                                  });
                                });

                                disableButtons.clear();
                                _updateList();
                                _updateButtonColor();
                              }
                              _updateTarget();
                            }
                          },
                        );

     _show() {
 return AnimatedOpacity(
  opacity: _visible ? 1.0 : 0.0,
  duration: const Duration(milliseconds: 500),
  child: _showDialog(context),
 );
}

_showDialog(BuildContext context) {
 return showDialog<String>(
  useSafeArea: true,
  barrierColor: Colors.red.withOpacity(0.5),
  barrierDismissible: false,
  context: context,
  builder: (BuildContext context) => const Icon(
    Icons.check_rounded,
     size: 100,
  ),
 );
}
 

要关闭 showDialog,您需要调用 Navigator.pop(context);

将此添加到您的 Future.delayed()

await Future.delayed(const Duration(milliseconds: 1000), () {
    setState(() {
       _visible = !_visible;
       Navigator.pop(context);
    });
});

当您调用 return showDialog<String>(... 时,您不在这个屏幕上:

return AnimatedOpacity(
  opacity: _visible ? 1.0 : 0.0,
  duration: const Duration(milliseconds: 500),
  child: _showDialog(context),
 );

所以你改变_visible没关系,如果你想关闭你需要调用的对话框页面:Navitagor.pop(context);在你的回调函数中;

Navitagor.pop(context);
setState(() {
  _visible = !_visible;
});

你这样做其实是错误的。

A​​nimatedOpacity 是一个 Widget & showDialog 是一个函数。当您将 showDialog 作为 AnimatedOpacity 的子级传递时,它会以某种方式工作但会破坏进一步的过程。如您所见,简单的 Future.delayed 不再起作用。您可以通过简单地在 _show();

上方和下方放置一个打印命令来测试它

当您在按钮上调用 AnimatedOpacity 时,它实际上是在您当前的小部件上创建一个新的小部件。现在,由于您当前的代码已损坏,因此该过程无法正常工作并且状态不再更新。

要解决这个问题,有三个选项

  1. 移除动画不透明度并正常显示对话框。 See example here
  2. 使用任何可以提供不透明度等对话动画的包。
  3. 使用 showGeneralDialog。 See example here ()