Flutter 通过 get 改变 int 状态

Question

我有一个简单的网站菜单，点击它只是改变 int 值，并根据 int 值改变字体颜色。

我不想使用 setState 而不是它我需要使用 getX 我是这样做的

class SideMenu extends StatefulWidget {
  const SideMenu({Key? key}) : super(key: key);
  @override
  _SideMenuState createState() => _SideMenuState();
}

class _SideMenuState extends State<SideMenu> {
  TileColorX tcx = Get.put(TileColorX());

  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        children: [
          DrawerHeader(
            child: Center(
                child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text('Dashboard ',
                    style: Theme.of(context).textTheme.caption!.copyWith(
                        color: Colors.white,
                        fontSize: 21,
                        fontWeight: FontWeight.w700)),
                Text('Dashboard',
                    style: Theme.of(context).textTheme.caption!.copyWith(
                        color: primaryColor,
                        fontSize: 21,
                        fontWeight: FontWeight.w700)),
              ],
            )),
          ),
          DrawerListTile(
            title: "Dashboard",
            svgSrc: "assets/icons/menu_dashbord.svg",
            control: 0,
            press: () {
              tcx.toggle(0);
            },
          ),
          DrawerListTile(
            title: "POS and Invoices",
            svgSrc: "assets/icons/menu_tran.svg",
            control: 1,
            press: () {
              tcx.toggle(1);
            },
          ),
        ],
      ),
    );
  }
}

class DrawerListTile extends StatelessWidget {
  DrawerListTile({
    Key? key,
    // For selecting those three line once press "Command+D"
    required this.title,
    required this.svgSrc,
    required this.press,
    required this.control,
  }) : super(key: key);

  final String title, svgSrc;
  final VoidCallback press;
  final int control;
  TileColorX tcx = Get.put(TileColorX());

  @override
  Widget build(BuildContext context) {
    return ListTile(
      onTap: press,
      horizontalTitleGap: 0.0,
      leading: SvgPicture.asset(
        svgSrc,
        color: control == tcx.selectedIndex.value
                ? Colors.white
                : Colors.white54,
        height: 16,
      ),
      title: Text(
        title,
        style: TextStyle(
            color: control == tcx.selectedIndex.value
                ? Colors.white
                : Colors.white54),
      ),
    );
  }
}

我有一个class用于切换

class TileColorX extends GetxController {
  RxInt selectedIndex = 0.obs;    
  void toggle(int index) => selectedIndex.value = index;    
}

但它没有改变状态（意思是不改变我的字体颜色）

Answer 1

您需要在要查看更改的小部件上使用 Obx。这会起作用

return Obx(() => ListTile(
      onTap: press,
      horizontalTitleGap: 0.0,
      leading: SvgPicture.asset(
        svgSrc,
        color: control == tcx.selectedIndex.value
            ? Colors.white
            : Colors.white54,
        height: 16,
      ),
      title: Text(
        title,
        style: TextStyle(
            color: control == tcx.selectedIndex.value
                ? Colors.white
                : Colors.white54),
      ),
    ));

我不知道 Obx 到底做了什么的更详细的答案，但它对你有用:D

Flutter 通过 get 改变 int 状态

Flutter change int state by get

dart

flutter

flutter-getx