Flutter应用重启后主题模式重置，如何实现主题状态持久化？

主题模式重启后恢复默认，是因为你没把用户的选择保存到本地。要解决这个问题，关键是把用户选的主题存在本地存储里，启动时再读出来应用上。具体操作步骤如下：

1. 添加本地存储依赖 #

用Flutter官方的shared_preferences包做轻量数据持久化，在pubspec.yaml里加依赖：

dependencies:
  flutter:
    sdk: flutter
  shared_preferences: ^2.2.2 # 版本号以官方最新为准

执行flutter pub get安装依赖。

2. 修改ThemeManager实现 #

假设你用的ThemeManager是继承ChangeNotifier的状态管理类，给它加保存主题和启动读主题的逻辑：

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

class ThemeManager extends ChangeNotifier {
  ThemeMode _themeMode = ThemeMode.system;

  // 启动时自动加载本地保存的主题
  ThemeManager() {
    _loadSavedTheme();
  }

  ThemeMode get themeMode => _themeMode;

  // 切换主题时同步存到本地
  void toggleTheme(bool isDark) {
    _themeMode = isDark ? ThemeMode.dark : ThemeMode.light;
    _saveTheme();
    notifyListeners();
  }

  // 从本地读取之前保存的主题设置
  Future<void> _loadSavedTheme() async {
    final prefs = await SharedPreferences.getInstance();
    final savedIsDark = prefs.getBool('isDarkTheme');
    
    if (savedIsDark != null) {
      _themeMode = savedIsDark ? ThemeMode.dark : ThemeMode.light;
    } else {
      // 没存过设置的话，默认跟着系统走
      _themeMode = ThemeMode.system;
    }
    notifyListeners();
  }

  // 把当前主题存到本地
  Future<void> _saveTheme() async {
    final prefs = await SharedPreferences.getInstance();
    await prefs.setBool('isDarkTheme', _themeMode == ThemeMode.dark);
  }
}

3. 确保启动时加载主题 #

在main.dart里，先初始化ThemeManager（让它读完本地主题），再启动应用：

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() async {
  // 必须先初始化Flutter绑定，才能调用异步方法
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化ThemeManager，此时会自动读本地保存的主题
  final themeManager = ThemeManager();
  
  runApp(MyApp(themeManager: themeManager));
}

class MyApp extends StatelessWidget {
  final ThemeManager themeManager;

  const MyApp({super.key, required this.themeManager});

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider.value(
      value: themeManager,
      child: MaterialApp(
        title: 'Flutter Theme Demo',
        theme: ThemeData.light(), // 你的浅色主题配置
        darkTheme: ThemeData.dark(), // 你的深色主题配置
        themeMode: themeManager.themeMode, // 让ThemeManager控制当前主题
        home: const LoginScreen(),
      ),
    );
  }
}

4. 现有设置页面不用改 #

你当前的主题设置页面代码完全可以保留，因为ThemeManager启动时已经加载了保存的主题，themeListener会自动监听变化更新UI。

这样改完后，用户切换主题时设置会存在本地，下次打开应用就会自动恢复之前选的模式了。

内容的提问来源于stack exchange，提问作者It'sPhil