仅针对特定小部件根据 Thememode 更改颜色。 [颤振,GetX]

时间:2021-06-05 14:33:56

标签: flutter dart getx flutter-getx

我有一个用于明暗模式的自定义 ThemeData。但是我想根据 ThemeMode 提供特定的不同颜色或样式的小部件很少,即覆盖自定义的深色或浅色 ThemeData。 在这里,我有一个容器,亮模式激活时颜色为灰色,暗模式激活时为黑色 12,但当 isDarkMode 分别为 truefalse 时颜色不会改变. 我正在使用 GetX 状态管理。

代码如下:

材料应用:

return GetMaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeController().lightTheme,
      darkTheme: ThemeController().darkTheme,
      themeMode: ThemeController().getThemeMode(),
      home: _dataController.onBoarding == null ? OnBoarding1() : HomeScreen(),
    );

主题控制器:

class ThemeController extends GetxController {
  // Dark theme bool
  bool isDarkTheme = false;

  // Change theme method
  changeTheme() {
    if (isDarkTheme == false) {
      isDarkTheme = true;
      changeThemeMode();
      print(isDarkTheme);
      update();
    } else if (isDarkTheme == true) {
      isDarkTheme = false;
      changeThemeMode();
      print(isDarkTheme);
      update();
    }
  }

  //
  void changeThemeMode() {
    Get.changeThemeMode(isDarkTheme ? ThemeMode.dark : ThemeMode.light);
    update();
  }

  //
  ThemeMode getThemeMode() {
    return isDarkTheme ? ThemeMode.dark : ThemeMode.light;
  }

  // Light Theme
  final lightTheme = ThemeData.light().copyWith(
    brightness: Brightness.light,
    backgroundColor: Color(0xfff5f5f5),
    scaffoldBackgroundColor: Color(0xfff5f5f5),
    primaryColor: Colors.blueAccent.shade100,
    appBarTheme: AppBarTheme(
      brightness: Brightness.light,
      backgroundColor: Colors.grey[200],
    ),
    cardTheme: CardTheme(
      color: Color(0xfff5f5f5),
    ),
  );

  // Dark Theme
  final darkTheme = ThemeData.dark().copyWith(
    brightness: Brightness.dark,
    appBarTheme: AppBarTheme(
      brightness: Brightness.dark,
      backgroundColor: Color(0xFF212121),
    ),
  );
}

界面:

return GetBuilder<ThemeController>(
      builder: (_themeController) => Container(
        height: 75.0,
        color: _themeController.isDarkTheme ? Colors.black26 : Colors.grey[200],
        child: Con....));

isDarkTheme 为真时,颜色不会改变。

0 个答案:

没有答案