How to remove showdialog visibility after code delay

Question

I set _visible to false after 1 second delay of the code, but the dialog remains on the screen. I wait for the dialog to disappear after a second. How can I set this?

                 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,
  ),
 );
}
 

Answer 1

When you call return showDialog<String>(... you are not on this screen:

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

So it is not matter if you change _visible if you want to close the dialog page you need to call: Navitagor.pop(context); inside your callback function;

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

Answer 2

To close _showDialog do yo need call Navigator.pop(context);

Add this inside your Future.delayed()

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