状态管理Getx

状态管理
Obx和GetxController。
Obx 反应状态管理器（GetX/Obx）
反应式编程可以疏远许多人
因为它据说很复杂
GetX将反应式编程变成了非常简单的事情：
不需要创建 StreamControllers
不需要为每个变量创建一个StreamBuilder
不需要为每个状态创建一个类
不需要为一个初始值创建一个get
不需要使用代码生成器
使用Get进行反应式编程就像使用setState一样简单

var name = 'Jonatas Borges'的变化
只需写成var name = 'Jonatas Borges'.obs
除了给属性值后面添加.obs外

定义Obx变量的方法：
第一种 使用 Rx{Type}
final name = RxString('Jonatas Borges');
第二种是使用 Rx，规定泛型 Rx<Type>
final name = Rx<String>('Jonatas Borges');
GetxController 主要的作用是用于UI代码与业务逻辑分离开来
class Controller extends GetxController {
var count = 0.obs;
var age = 18.obs;
void increment() => count++;
@override
void onInit() {
super.onInit();
//监听count的值变化
ever(count, (callback) => print("count"));
// 监听count age的值
everAll([count, age], (callback) => print(callback));
once(count, (callback) => print("count值改变时调用,只执行一次"));
debounce(count, (callback) => print("1s后调用,防止DDos"));
interval(count, (callback) => print("忽略1s内所有变动"));
}
}

...
appBar: AppBar(
title: Obx(
// 展示count
() => Text("Clicks: ${c.count}"),
),
),
...
floatingActionButton: FloatingActionButton(
// 修改count
onPressed: () => c.increment(),
child: Icon(Icons.add),
),
uniqueID：GetxController监听过程中，单独在某个GetBuilder上设置。这样更好的管理这个状态。
```tag```：区分不同的控制器来实现不同的功能，减少控制器代码量和重复创建。
class Controller extends GetxController {
...
void testUniqueID() {
age += 10;
// home_age_id:uniqueID
update(["home_age_id"]);
}
...
}
final Controller c = Get.put(Controller());
// print(c);
return Scaffold(
body: Column(
children: [
//GetBuilder <Controller> 必须指定 不然会崩溃！！！
GetBuilder<Controller>(
id: "home_age_id",
tag:"tagxxxx",
builder: (controller) {
return Obx(
() => Text("Clicks: ${c.age}"),
);
// return Text("1111");
// return Text("年龄值为: ${c.age}",);
},
),
ElevatedButton(
onPressed: () => c.testUniqueID(),
child: Text("增加年龄"),
)
],
),
);

国际化配置
国际化配置是状态管理领域的一个重要应用，使用 Getx非常快捷方便，是做这种应用的不二选择。
1 自定义个继承与Translations的类，重写keys
class InternationalConfigure extends Translations {
@override
// TODO: implement keys
Map<String, Map<String, String>> get keys => {
'zh_CN': {
'hello': "你好, GetX"
},
'en_US': {
'hello': 'Hello GetX',
},
};
}
2 在入口出国际化配置
GetMaterialApp {
...
translations: InternationalConfigure(),
// 设置默认语言
locale: Locale("zh",'CN'),
// 在配置错误的情况下 显示的语言
fallbackLocale: Locale("zh",'CN'),
...
}
3 使用国际化配置
首先在状态管理类里实现updateLocale 方法，
class Controller extends GetxController {
...
void changeLanguage(String languageCode, String countryCode) {
Get.updateLocale(Locale(languageCode, countryCode));
}
...
}
然后就可以切换使用了
Text('hello'.tr, style: TextStyle(color: Colors.pink, fontSize: 30)),
ElevatedButton(
onPressed: () => c.changeLanguage('zh', 'CN'),
child: Text("切换中文"),
),

ElevatedButton(
onPressed: () => c.changeLanguage('en', 'US'),
child: Text("切换英文"),
),