CODEWITHSUNDEEP
flutterdart
user9139407
user9139407

Reputation: 1022

when user click first time it's changed but second time doesn't

I designed a circle using a container widget. I need to change BoxDecoration when the user clicks. It change only first click. and user click again I need to change again

   GestureDetector(
           onTap: () {
              setState(() {
                radiocheck = true;//problem is here, if user click second time always true, is that way to reverse dicision
              });
          },
          child: Container(
                    height: 14.0,
                    width: 14.0,
                    decoration:radiocheck?
                                   BoxDecoration(
                                     color: Color(0xFF4A90E2),
                                     shape: BoxShape.circle,          
                                   ):                     
                                   BoxDecoration(
                                     border: Border.all(color:Color(
                                             0xFF4A90E2), width: 1),
                                     shape: BoxShape.circle,
                                     ),
                                   ),
                 ),

Upvotes: 0

Views: 571

Answers (1)

R. Flierman
R. Flierman

Reputation: 109

Separate the container into a new function works best. Then have some bool or int to check if the button was pressed previously.

So like:

Widget _someFunction(){
   return GestureDetector(
           onTap: () {
              setState(() {}); // this should already get the correct radiocheck
          // otherwise, you can remove it from the container below and make if/else statement here
          },
          child: _buildContainer();
}

Widget _buildContainer(){
  BoxDecoration boxDecoration;

  if(radiocheck){
    boxDecoration = BoxDecoration(
      color: Color(0xFF4A90E2),
      shape: BoxShape.circle,
    );
    radiocheck = false;
  } else {
    boxDecoration= BoxDecoration(
      border: Border.all(color:Color(
          0xFF4A90E2), width: 1),
      shape: BoxShape.circle,
    );
    radiocheck = true;
  }

  return Container(
    height: 14.0,
    width: 14.0,
    decoration: boxDecoration,
  );
}

EDIT: in your edited message I see you want/need to change state.

Upvotes: 1

Related Questions