使用 getx 切换小部件属性

Question

I am using Getx. I need when the user click a card only the selected one's border change like this:

but if the user select both two of them will be colored. how to prevent that?

The Code is:

class SelectRoleController extends GetxController{
  bool isClicked=false;
  Color color=whiteColor;
  
  void toggle({required String id}){
    isClicked=!isClicked;
     isClicked?color=primaryColor : color=whiteColor;
     update([id]);
  }
}

Answer 1

Am not so sure exactly what you asking. Does each card widget use that controller on its own? It seems to me you are managing two states independently when they should be one. So instead of having a SelectRoleController for each card. Create one controller class that both cards listen to and instead of using a boolean value for state use something like an index to show the current selected one.

Answer 2

Am not so sure exactly what you asking. Does each card widget use that controller on its own? It seems to me you are managing two states independently when they should be one. So instead of having a SelectRoleController for each card.

Solution

Create one controller class that both cards listen to and instead of using a boolean value for state use something like an index to show the current selected one. Instead of using GetxBuilder and updating it with an Id wrap the card widget with an Obx and listen to the controller's current.