使用Cubit实现亮暗模式

本项目将解释如何使用Cubit状态管理架构实现亮暗模式。

项目创建与维护者

MultiQoS 有限责任公司。

入门

通过使用Cubit状态管理，添加主题支持的最简单方法。 在此演示中，我们正在更新按钮和标签的背景颜色和文本颜色。

依赖项

  1. Bloc：使用了flutter_bloc库进行状态管理。 Bloc
  2. Shared Preference：使用了shared_preferences库进行本地存储。 Shared Preference

文件夹和类结构

.
├── ...
├── Cubit                        # This folder hold all cubit sub folders.
│   └── theme_module             # This folder will hold two sub folder provider and states.
│         ├── provider           # This folder will hold them cubit class.
│         └── states  		 # This folder will hold theme state class.
│   
├── theme                        # This folder hold all the themes related classes.
│   ├── base_theme               # This an abstract class for color setup
│   ├── dark_theme               # This class will have all dark theme colors and extend the base_theme class. 
│   ├── light_theme              # This class will have all light theme colors and extend the base_theme class. 
│   ├── theme_colors             # All colors will define in this class. For light mode, LightThemeColors class and for dark mode, DarkThemeColors is being used for color declaration.
│   └── enum                     # Delcared the theme enum in this class.
└── ...

演示

Screen.Recording.2022-04-19.at.12.56.41.PM.mov

GitHub

查看 Github