基于ThemeData实现自定义主题

theme_provider.dart

继承ChangeNotifier，实现主题管理，每次更改主题，负责通知主题更新。

/// 扩展 ThemeMode 函数,实现String -> ThemeMode 的映射关系
extension ThemeModeExtension on ThemeMode {
  String get value => <String>['System', 'Light', 'Dark'][index];
}

class ThemeProvider extends ChangeNotifier {
  ThemeMode _themeMode;

  ThemeMode getThemeMode() {
    // 读取系统theme
    String theme = HiCache.getInstance().get(HiConstants.theme);
    // 根据缓存的theme，获取实际ThemeMode
    switch (theme) {
      case 'Dark':
        _themeMode = ThemeMode.dark;
        break;
      case 'System':
        _themeMode = ThemeMode.system;
        break;
      default:
        _themeMode = ThemeMode.light;
        break;
    }
    return _themeMode;
  }

  /// 设置主题
  void setTheme(ThemeMode themeMode) {
    HiCache.getInstance().setString(HiConstants.theme, themeMode.value);
    // 通知主题样式更新
    notifyListeners();
  }

  /// 获取主题样式
  ThemeData getTheme({bool isDarkMode = false}) {
    var themeData = ThemeData(
      brightness: isDarkMode ? Brightness.dark : Brightness.light,
      errorColor: isDarkMode ? HiColor.dark_red : HiColor.red,
      primaryColor: isDarkMode ? HiColor.dark_bg : white,
      accentColor: isDarkMode ? primary[50] : white,
      // Tab 指示器颜色
      indicatorColor: isDarkMode ? primary[50] : white,
      // 页面背景色
      scaffoldBackgroundColor: isDarkMode ? HiColor.dark_bg : white,
    );
    return themeData;
  }
}

color.dart

添加主题色

/// 定义主题色
class HiColor {
  static const Color red = Color(0xFFFF4759);
  static const Color dark_red = Color(0xFFE03E4E);
  static const Color dark_bg = Color(0xFF18191A);
}

main.dart

设置主题

MaterialApp(
            home: widget,
            theme: ThemeProvider().getTheme(),
            darkTheme: ThemeProvider().getTheme(),
            themeMode: ThemeProvider().getThemeMode(),
  )