Get.changeTheme is not working when the device is in dark mode
Describe the bug Get.changeTheme is not working when the device is in dark mode. Tested on Android devices.
Reproduction code
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
Get.changeTheme(_counter.isEven ? ThemeData.dark() : ThemeData.light());
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
To Reproduce Steps to reproduce the behavior:
- Create Flutter Starter Project
- Add Getx 4.1.4
- Change MaterialApp with GetMaterialApp
- Add
Get.changeTheme(_counter.isEven ? ThemeData.dark() : ThemeData.light());to the _incrementCounter() method
Expected behavior When the device is not in dark mode, the app works as expected. In dark mode changing the theme is not working.
Flutter Version: Channel stable, 2.0.6
Getx Version: 4.1.4
Describe on which device you found the bug: Pixel 4 (API 30), Android Studio Emulator (Pixel C (API 29), Pixel 4 (API 30))
I can confirm that this also happens on iOS with activated dark mode.
When dark mode is active on an iOS device, the Theme of the app won't change when using Get.changeTheme(themeData). As soon as the iOS device is changed to the light mode, the change of the theme works as expected.
The behaviour is similar for the web as well. Thought might just add that here. And a deprecation warning comes up when switching from light to dark
Warning: The support for configuring the foreground color of FloatingActionButtons using ThemeData.accentIconTheme has been deprecated. Please use ThemeData.floatingActionButtonTheme instead. See https://flutter.dev/go/remove-fab-accent-theme-dependency. This feature was deprecated after v1.13.2.
Warning: The support for configuring the foreground color of FloatingActionButtons using ThemeData.accentIconTheme has been deprecated. Please use ThemeData.floatingActionButtonTheme instead. See https://flutter.dev/go/remove-fab-accent-theme-dependency. This feature was deprecated after v1.13.2.
Warning: The support for configuring the foreground color of FloatingActionButtons using ThemeData.accentIconTheme has been deprecated. Please use ThemeData.floatingActionButtonTheme instead. See https://flutter.dev/go/remove-fab-accent-theme-dependency. This feature was deprecated after v1.13.2.
Warning: The support for configuring the foreground color of FloatingActionButtons using ThemeData.accentIconTheme has been deprecated. Please use ThemeData.floatingActionButtonTheme instead. See https://flutter.dev/go/remove-fab-accent-theme-dependency. This feature was deprecated after v1.13.2.
I found a temporary solution, GetMaterialApp( //Add this line: themeMode: ThemeMode.light, )
But I need it to default to ThemeMode.dark and this isn't working as of now. When I try to use Get.changeTheme after setting ThemeMode.dark as themeMode in GetMaterialApp, nothing works ! I was losing my mind until I decided to come and check for issues here.
I'm using v4.3.6
But I need it to default to
ThemeMode.darkand this isn't working as of now. When I try to useGet.changeThemeafter settingThemeMode.darkasthemeModeinGetMaterialApp, nothing works ! I was losing my mind until I decided to come and check for issues here.I'm using v4.3.6
set the theme to dark and themeMode to light. Works on me.
theme: ThemeData.dark(),
themeMode: ThemeMode.light,
I think it is a version 4 bug.
There is no way to reproduce this problem in latest release candidate
I found a temporary solution, GetMaterialApp( //Add this line: themeMode: ThemeMode.light, )
This works. Setting the themeMode to either dark or light works like a charm.
this happings to me now. if themeMode is dark when initialized, Get.changeTheme to light is not working.
themeMode: isDark ? ThemeMode.dark : ThemeMode.light,
main.dart
import 'dart:io';
import 'package:echo_cloud/consts/config.dart';
import 'package:echo_cloud/pages/chat/index.dart';
import 'package:echo_cloud/pages/index/index_page.dart';
import 'package:echo_cloud/pages/me/index.dart';
import 'package:echo_cloud/pages/take_photos/index.dart';
import 'package:echo_cloud/routes/app_routes.dart';
import 'package:echo_cloud/theme/app_themes.dart';
import 'package:echo_cloud/utils/methods/audio_service.dart';
import 'package:echo_cloud/utils/methods/storage.dart';
import 'package:echo_cloud/utils/theme.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await StorageHelper.init();
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
Future<bool> _loadTheme() async {
return StorageHelper.getBool(Config.darkModeKey) ?? false;
}
@override
Widget build(BuildContext context) {
return FutureBuilder<bool>(
future: _loadTheme(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const MaterialApp(
home: Scaffold(body: Center(child: CircularProgressIndicator())),
);
}
// Get theme config
bool isDark = snapshot.data ?? false;
return ScreenUtilInit(
designSize: const Size(393, 852),
minTextAdapt: true,
splitScreenMode: true,
builder: (_, child) {
return GetMaterialApp(
title: 'CloudEcho',
theme: AppTheme.lightTheme,
darkTheme: AppTheme.darkTheme,
themeMode: isDark ? ThemeMode.dark : ThemeMode.light,
getPages: AppPage.routes,
defaultTransition: Transition.rightToLeft,
);
},
);
},
);
}
}