Flutter：如何监听 GetX 上的变量变化

Question

我想根据 pressedBool 是假还是真来更改小部件的主体。

这是我写的GetxController

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

}

这里是 GetX 更新和侦听更改页面正文的地方：

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

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

如何让 GetX 监听 pressedBool 变量？

Answer 1

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

Answer 2

有 3 种方法可以监听控制器中属性的变化。您在控制器的 setter 方法中使用了 update() 方法，因此第一个适合您，也是最轻量级的方法。

如果您没有在小部件中初始化控制器，则：

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

如果您已经初始化了控制器并且它在内存中，那么：

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

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

Answer 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(...),
        })

Answer 4

有时，仅监听更改并更改其他一些控制器或变量的值很有用。例如，如果我们想从另一个屏幕更改选项卡。

我们可以用 Rx 变量创建控制器

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

及之后，在带有选项卡的屏幕上收听更改

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

因此，我们可以监听可观察变量的变化。

Answer 5

这是你的控制器

import 'package:get/get.dart';

class YourController extende GetxController{

  var yourBoolVar = false.obs;
  
  toggleBoolValue(){

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

}

然后听听屏幕上的变化

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

)

使用它来切换它在您的视图中的值 Class

YourView.dart

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

Answer 6

你可以在控制器上使用ever方法例如



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

或者在控制器中声明这个

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();
  }
}

Flutter：如何监听 GetX 上的变量变化

Flutter: How to listen to variable change on GetX

flutter

flutter-getx