Text widget doesn't appear in dialog after user Future.delayed in Flutter-CodePudding

I have a dialog that appears after user click on send button . When dialog appears , I want to show a text after 5 seconds . I use Future.delayed but the text doesn't appear at all . It appears only when I close the dialog and open it again . I want to show the text after 5 seconds from opening the dialog .

Here is my function

  void _initialize() {
    Future<void>.delayed(const Duration(seconds: 3), () {
      if (mounted) {
        setState(() {
          visibility = true;
        });
      }
    });
  }
}

And here is my dialog code in the onTab of the button

_initialize()
 showDialog(context: context,
        barrierDismissible: false,

        builder: (BuildContext contextd){

          return  WillPopScope(

            onWillPop: () {return Future.value(false);},
            child: Dialog(
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(10)
              ),
              child: Padding(
                padding: EdgeInsets.fromLTRB(20.w, 20.h, 20.w, 20.h),
                child: Column(
                        children: [
                       //here are some widgets
                      Visibility(
                        visible:visibility?true:false,
                        child: Text("Resend?",style: TextStyle(decoration: 
                              TextDecoration.underline,),)),
               ],),
              ),
            ),
          );

        });

CodePudding user response：

This happens because your setState that update visibility has a different context than builder dialog. Visibility is actually update but only appear in dialog when close and open again because this is how build dialog is updated. If you want to work with the context dialog need to use that widget:

StatefulBuilder(
      builder: (context, setState) {

Into your dialog and then call that setState.

CodePudding user response：

Try using StatefulBuilder like this:

showDialog(
        context: context,
        builder: (BuildContext context) => StatefulBuilder(
          builder: (context, setState) {
            return //somthing to return;
          },
        ));

CodePudding user response：

Try using a StatefulBuilder. Using the bool visible and the setDialogState argument, you can update the state of the contents of the dialog.

showDialog(
  context: context,
  barrierDismissible: false,
  builder: (BuildContext context) {
    return StatefulBuilder(
      builder(context, setDialogState) {
        // this variable is used for the conditional display
        bool visible = false;
        // this future will update the visible variable in 3 seconds, after the dialog is displayed already
        Future.delayed(Duration(seconds: 3)).then(() => setDialogState(() { visible = true;}));
        return WillPopScope(
          onWillPop: () { return Future.value(false); },
          child: Dialog(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(10)
              ),
            child: Padding(
              padding: EdgeInsets.fromLTRB(20.w, 20.h, 20.w, 20.h),
              child: Column(
                children: [
                  //here are some widgets
                  Visibility(
                    visible:visible,
                    child: Text(
                      "Resend?",
                      style: TextStyle(
                        decoration: TextDecoration.underline,
                        ),
                      ),
                    ),
                  ],
                  ),
              ),
            ),
          );
      },
      );
};