BirjuVachhani / adaptive_theme

Easiest way to add support for light and dark theme in your flutter app.
https://pub.dev/packages/adaptive_theme
Apache License 2.0
464 stars 37 forks source link

Restart App color disappeared #60

Closed badpinkman closed 1 month ago

badpinkman commented 4 months ago

Describe the bug Restart the app and customize the color to disappear.

To Reproduce Steps to reproduce the behavior:

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  final savedThemeMode = await AdaptiveTheme.getThemeMode();
  runApp(MyApp(savedThemeMode: savedThemeMode));
}
class MyApp extends StatelessWidget {
  final AdaptiveThemeMode? savedThemeMode;
  const MyApp({super.key, this.savedThemeMode});
  ...
}

...

ElevatedButton(
  onPressed: () {
    AdaptiveTheme.of(context).setTheme(
      light: ThemeData(
        useMaterial3: true,
        brightness: Brightness.light,
        colorSchemeSeed: Colors.green,
      ),
      dark: ThemeData(
        useMaterial3: true,
        brightness: Brightness.dark,
        colorSchemeSeed: Colors.green,
      ),
    );
  },
  child: const Text('Green'),
),
  1. Restart App
  2. colorSchemeSeed: Colors.green, not work

Additional context When I changed the theme, I changed the color, but when I restarted the app, I found that the set color had disappeared. Through the README, I found that I can use isDefault when setting the theme, but I did not find this parameter in the latest version. How can I save the color I set, and when restarting the APP, I hope to display the color I set. Thanks a lot.

BirjuVachhani commented 4 months ago

@badpinkman

Adaptive theme does not persist your theme configuration(your ThemeData object) across app restarts. It is not possible to recreate the last ThemeData object that was used as current theme.

In your case, you are changing theme after initialization. You can persist that action yourself (just store say, a bool in shared preferences that indicates that a different theme was used) and can retrieve this information on initialization and use it to pass correct theme in your MaterialApp initialization.

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  final savedThemeMode = await AdaptiveTheme.getThemeMode();
  final pref = await SharedPreferences.getInstance();
  final bool isUsingGreenTheme = pref.getBool('green_theme');

  runApp(MyApp(savedThemeMode: savedThemeMode, isUsingGreenTheme:isUsingGreenTheme));
}

class MyApp extends StatelessWidget {
  final AdaptiveThemeMode? savedThemeMode;
  final bool isUsingGreenTheme;

  const MyApp({super.key, this.savedThemeMode, this.isUsingGreenTheme = false});

  @override
  Widget build(BuildContext context) {
   final lightTheme = isUsingGreenTheme ? ThemeData(
        useMaterial3: true,
        brightness: Brightness.light,
        colorSchemeSeed: Colors.green,
      ) : ThemeData(
        useMaterial3: true,
        brightness: Brightness.light,
        colorSchemeSeed: Colors.blue,
      );

    final darkTheme = isUsingGreenTheme ? ThemeData(
        useMaterial3: true,
        brightness: Brightness.dark,
        colorSchemeSeed: Colors.green,
      ) : ThemeData(
        useMaterial3: true,
        brightness: Brightness.dark,
        colorSchemeSeed: Colors.blue,
      );

    return AdaptiveTheme(
      light: lightTheme,
      dark: darkTheme,
      initial: savedThemeMode,
      builder: (theme, darkTheme) => MaterialApp(
        theme: theme,
        darkTheme: darkTheme,
        home: MyHomePage(),
      ),
    );
  }
}
BirjuVachhani commented 1 month ago

Closing this issue due to inactivity. Feel free to reopen if further help is required. Thanks!

badpinkman commented 1 month ago

Thank you very much for your suggestion, you solved my problem, thank you.