Home > database >  Elevated Button that can able to click just once -Flutter
Elevated Button that can able to click just once -Flutter

Time:12-09

i have an Elevated button for sign in anonymously. When i click the button it creates an user id automaticly and routes to home page but if i spam it untill home page comes to screen it creates many different user ids. i want the button to be unclickable after clicking once how can i do that? When i try this way i get error The argument type 'Future Function()?' can't be assigned to the parameter type 'void Function()' because 'Future Function()?' is nullable and 'void Function()' isn't.

MyElevatedButton(
            child: Text('Sign In Anonymously'),
            color: Colors.yellowAccent,
            onPressed: _isLoading
                ? null
                : () async {
                    setState(() {
                      _isLoading = true;
                    });
                    final user =
                        await Provider.of<Auth>(context, listen: false)
                            .signInAnonymously();
                  },
          ),

CodePudding user response:

Create a bool to keep track of click event on state class

bool _isClicked = false;

If user click it, make it true, and proceed the operation.

 ElevatedButton(
            onPressed: _isClicked
                ? null
                : () {
                    setState(() {
                      _isClicked = true;
                    });
                    //rest code
                  },
            child: Text(""),
          ),

CodePudding user response:

If you use stateful widget, just add a variable to check processing.

Awidget Stateful... {
   bool isProcessing = false;

   ...
   MyElevatedButton(
      ...
      onPressed: isProcessing ? null : () async {
         setState(() {
            isProcessing = true;
         });
         final user = await Provider.of<Auth>(context, listen: false)
            .signInAnonymousle();
         setState(() {
            isProcessing = false;
         });
      ...
}
  • Related