[bug]: Stacked_Themes ThemeManager about stacked

[Sentinel111]

Forgot to mention my main class:

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  setPathUrlStrategy();
  await setupLocator(stackedRouter: stackedRouter);
  await ThemeManager.initialise();
  setupDialogUi();
  setupBottomSheetUi();
  runApp(const MainApp());
}

class MainApp extends StatelessWidget {
  const MainApp({super.key});

  @override
  Widget build(BuildContext context) {
    return ThemeBuilder(
      defaultThemeMode: ThemeMode.light,
      darkTheme: ThemeData(
        brightness: Brightness.dark,
        scaffoldBackgroundColor: Colors.blue[900],
      ),
      lightTheme: ThemeData(
        brightness: Brightness.light,
        scaffoldBackgroundColor: Colors.blue[100],
      ),
      builder: (context, regularTheme, darkTheme, themeMode) => ResponsiveApp(
        builder: (_) => MaterialApp.router(
          theme: regularTheme,
          darkTheme: darkTheme,
          themeMode: ThemeMode.light,
          routerDelegate: stackedRouter.delegate(),
          routeInformationParser: stackedRouter.defaultRouteParser(),
        ),
      ).animate().fadeIn(
            delay: const Duration(milliseconds: 50),
            duration: const Duration(milliseconds: 400),
          ),
    );
  }
}

[Sentinel111]

I got it to work.

For anyone who is having this issue, these are the steps:

Add the import in the pubspec.

In the app.dart add this line:

Singleton(classType: ThemeService, resolveUsing: ThemeService.getInstance),

Run "stacked generate"
Which adds this line in "app.locator":

locator.registerSingleton(ThemeService.getInstance());

I tried to add this manually without using Stacked generate and doesn't work.

In the main.dart add the Theme Builder really before the "MaterialApp.router":

Widget build(BuildContext context) {
    return ResponsiveApp(
      builder: (_) => ThemeBuilder(
        defaultThemeMode: ThemeMode.system,
        darkTheme: ThemeData(
          brightness: Brightness.dark,
          scaffoldBackgroundColor: Colors.blue[900],
        ),
        lightTheme: ThemeData(
          brightness: Brightness.light,
          scaffoldBackgroundColor: Colors.blue[100],
        ),
        builder: (context, regularTheme, darkTheme, themeMode) =>
            MaterialApp.router(
          theme: regularTheme,
          darkTheme: darkTheme,
          themeMode: themeMode,
          routerDelegate: stackedRouter.delegate(),
          routeInformationParser: stackedRouter.defaultRouteParser(),
        ),
      ).animate().fadeIn(
            delay: const Duration(milliseconds: 50),
            duration: const Duration(milliseconds: 400),
          ),
    );
  }

Got it working in this Test project. Probably will do a PR to create better documentation in the stacked_themes repo.