'Flutter: How to listen to variable change on GetX

I want to change body of the widget depending on if the pressedBool is false or true.

Here is GetxController I wrote.

    import 'package:get/state_manager.dart';
    
    class PressedState extends GetxController{
      var pressedBool = true;
      changeStatus() {
        if(pressedBool){
          pressedBool = false;            
        }
        else {
          pressedBool = true;
        }
        update();
      }

}

Here is where GetX update and listen should work out to change body of the page:

final PressedState pressController = Get.put(PressedState());

return MaterialButton(
    onPressed: () {
      pressController.changeStatus();
    },
    child: 
      pressController.pressedBool
            ? Container(...) : Container(...)), ...

How can I make GetX to listen pressedBool variable ?

flutter flutter-getx

Solution 1:^[1]

return MaterialButton(
    onPressed: () {
      pressController.changeStatus();
    },
    child:
      GetBuilder<PressedState>(
        init: PressedState() 
        builder: (pressController) {
          return pressController.pressedBool
            ? Container(...) : Container(...))
        }
      ),

Solution 2:^[2]

Sometimes, it is useful just listen changes and change the value of some others controllers or variables. For example, if we want to change the tab from another screen.

We can create controller with Rx variable

class TabStateController extends GetxController {
  RxInt tabIndex = 0.obs;
}

and after, on the screen with tabs listen to changes

      _tabStateController.tabIndex.listen((value) {
        _tabController.index = value; 
      });

So, we can listen for changes in the observable variables.

Solution 3:^[3]

YourController.dart

import 'package:get/state_manager.dart';

class PressedState extends GetxController{

  RxBool pressedBool = true.obs;

  void changeStatus() {
     pressedBool.toggle();
  }

}

YourView.dart

final Controller pressController = Get.put(PressedState());

return MaterialButton(
    onPressed: () {
      pressController.changeStatus();
    },
    child: Obx(() {
     return pressController.pressedBool.isTrue
            ? Container(...) 
            : Container(...),
        })

Solution 4:^[4]

There are 3 ways to listen to change to a property in your controller. You are using update() method in your setter method in your controller so the first one will work for you, also it is the lightest method.

If you didn't initialize a controller in your widget, then:

final Controller _controller = Get.put(Controller());

If you have initialized your controller already and it's in memory, then:

final Controller _controller = Get.find<Controller>();

GetBuilder<Controller> (
init: _controller,
builder: (_) {
 return Text('${_controller.property}');
}
)

Solution 5:^[5]

Here is your controller

import 'package:get/get.dart';

class YourController extende GetxController{

  var yourBoolVar = false.obs;
  
  toggleBoolValue(){

  if(yourBoolVar.isTrue){
    yourBoolVar.toggle();
  }
    yourBoolVar.value = true;
  }

}

and after that listen to changes in your screen

GetX<YourController>(builder: (controller){
  if(controller.yourBoolVar.value){
   // return your true statement view from here
  }else{
   // return your false statement view from here
  }

)

use this to toggle its value in your View Class

YourView.dart

final YourController controller = Get.put(YourController());
return MaterialButton(
        onPressed:() {
        controller.toggleBoolValue();
   }
);

Solution 6:^[6]

you can use ever method on the controller for example



 final Controller c = Get.put(Controller());
 ever(c.counter, (value) => print("$value has been changed"));

or in controller, you declare this

import 'package:get/get.dart';

class Controller extends GetxController {
  var counter = 50.obs;


  void increment() {
    counter = counter + 1;
  }

  @override
  void onInit() {
    ever(counter, (value) => print("$value has been changed!!!"));
    super.onInit();
  }
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Eduardo Florence
Solution 2	awaik
Solution 3
Solution 4	Dharman
Solution 5	Vivek Bhardwaj
Solution 6

'Flutter: How to listen to variable change on GetX

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Solution 5:[5]

Solution 6:[6]