Getx flutter when i change theme from light to dark mode and then return to light mode its not returning my custom theme its load old app bar background even theme changes
ThemeData lightTheme = ThemeData(
useMaterial3: true,
backgroundColor: Colors.white,
appBarTheme: AppBarTheme(
elevation: 1000,
backgroundColor: Colors.white,
)
);
ThemeData darkTheme = ThemeData.dark().copyWith(primaryColor: Colors.red);
Getx flutter when i change theme from light to dark mode and then return to light mode its not returning my custom theme its load old app bar background even theme changes
class _MyMaterialAppState extends State<MyMaterialApp> {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
debugShowCheckedModeBanner: false,
title: appName,
theme: lightTheme,
darkTheme: darkTheme,
translations: Languages(),
locale: Get.deviceLocale,
fallbackLocale: const Locale('en', 'US'),
home: const MyHomePage(),
);
}
}
Probably, this is because of the GetMaterialApp
widget in the build
method. Because the build
method is called every time the widget is updated, this means that your custom theme will be overwritten. You can do something like this:
class _MyMaterialAppState extends State<MyMaterialApp> {
GetxController<ThemeData> _themeController = GetxController(lightTheme);
@override
Widget build(BuildContext context) {
return GetBuilder<GetxController<ThemeData>>(
init: _themeController,
builder: (_, theme) {
return GetMaterialApp(
debugShowCheckedModeBanner: false,
title: appName,
theme: theme.value,
darkTheme: darkTheme,
translations: Languages(),
locale: Get.deviceLocale,
fallbackLocale: const Locale('en', 'US'),
home: const MyHomePage(),
);
},
);
}
}
This code uses GetBuilder
to listen for changes to the _themeController
and update theme
property.
To change the theme:
_themeController.updateValue(newTheme)