Trying to make a button which replace text with circlularprogressIndication. when task or function done and not working properly is there any function called Whencompleted or something pls susggest

  class Continue extends StatefulWidget {
  const Continue({Key? key, required this.ontap}) : super(key: key);
  final Function ontap;

  @override
  State<Continue> createState() => _ContinueState();
}

class _ContinueState extends State<Continue> {
  bool loading = false;
  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () async {
        setState(() {
          loading = true;
        });
        await widget.ontap();
        setState(() {
          loading = false;
        });
      },
      child: Container(
        width: 180.w,
        height: 50.h,
        decoration: BoxDecoration(
          color: Theme.of(context).primaryColorDark,
          borderRadius: const BorderRadius.all(Radius.circular(4)),
        ),
        child: Padding(
          padding: EdgeInsets.all(8.sp),
          child: Center(
            child: loading == true
                ? CircularProgressIndicator(
                    color: Theme.of(context).primaryColor,
                  )
                : ResponsiveText(
                    text: 'Continue',
                    maxLines: 1,
                    centered: true,
                    size: 16,
                    style: TextStyle(color: Theme.of(context).primaryColor),
                  ),
          ),
        ),
      ),
    );
  }
}

ontap: () {Timer(Duration(seconds: 3), () { setState(() {otpActive = true;});});},

CodePudding user response：

Function is not async, if you want to do something in async you should use Future so change to this:

final Future<void> Function() ontap;

and also in your ontap do this:

ontap: ()async{
    await Future.delayed(Duration(seconds: 3));
    setState(() {
       otpActive = true;
    });
  },

CodePudding user response：

Just use Future.delayed instead of Timer in your OnTap function:

     () async {
         await Future.delayed(Duration(seconds: 3), () {
          setState(() {
             otpActive = true;
           });
        });
      }