Themes are not applied to MaterialApp

[VadymPinchuk]

I have used this widget tree: ThemeProvider( saveThemesOnChange: true, loadThemeOnInit: true, defaultThemeId: 'light', themes: [...], child: ThemeConsumer( child: MaterialApp(

And I expect to have this themes configs in my application. In cases where I cant wrap widgets and set proper colors from theme. For example canvas color. Looks like MaterialApp do no affected and themeData not set to it.

[kdsuneraavinash]

The reason for this is that MaterialApp applies a Theme() widget with its own themeData on top which makes ThemeProvider useless. But you can use following snippet to add the theme data from ThemeProvider to the MaterialTheme.

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ThemeProvider(
      saveThemesOnChange: true,
      loadThemeOnInit: true,
      defaultThemeId: 'default_light_theme',
      themes: [
        AppTheme.light(),
        AppTheme.dark(),
      ],
      child: ThemeConsumer(
        child: Builder(
          builder: (themeContext) => MaterialApp(
            theme: Theme.of(themeContext),
            title: 'Flutter Demo',
            home: MyHomePage(),
          ),
        ),
      ),
    );
  }
}

Here I have wrapped MaterialApp with a Builder and used that context to apply theme data for the material App.

However, please note that doing this might sometimes case a flicker in the screen due to the latency of the loading theme. It is mostly unnoticeable, but sometimes can be seen. That was the reason I decided to use a theme consumer for each route independently.

I am closing this issue now, but if you still have the problem feel free to reopen.

[baoxiehao]

Thanks for sharing. I think the readme is very misleading.