I am currently working on a Flutter project and I have defined a light theme in my app_theme.dart file as follows:
final ThemeData lightTheme = ThemeData(
useMaterial3: true,
fontFamily: "Inter",
brightness: Brightness.light,
colorScheme: ColorScheme.light(
background: AppColor.backgroundLight,
onBackground: AppColor.black,
primary: AppColor.primary,
surface: AppColor.greyLight,
inverseSurface: Colors.grey.shade400,
inversePrimary: AppColor.black,
),
textTheme: TextTheme(
titleLarge: const TextStyle().copyWith(
fontSize: 24.sp,
fontWeight: FontWeight.w600,
color: AppColor.black,
),
titleMedium: const TextStyle().copyWith(
fontSize: 22.sp,
fontWeight: FontWeight.w600,
color: AppColor.black,
),
inputDecorationTheme: InputDecorationTheme(
errorMaxLines: 1,
prefixIconColor: AppColor.greyStrong,
suffixIconColor: AppColor.greyStrong,
contentPadding: EdgeInsets.symmetric(vertical: 13.h, horizontal: 16.w),
filled: true,
fillColor: AppColor.greyLight,
hintStyle: const TextStyle().copyWith(
fontSize: 12.sp,
fontWeight: FontWeight.w500,
color: AppColor.greyStrong,
height: 1.0,
textBaseline: TextBaseline.alphabetic
),
labelStyle: const TextStyle().copyWith(
fontSize: 12.sp,
fontWeight: FontWeight.w500,
color: AppColor.greyStrong,
height: 1.0,
textBaseline: TextBaseline.alphabetic
),
border: const OutlineInputBorder().copyWith(
borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(12.r),
),
enabledBorder: const OutlineInputBorder().copyWith(
borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(12.r),
),
focusedBorder: const OutlineInputBorder().copyWith(
borderRadius: BorderRadius.circular(8.r),
borderSide: const BorderSide(color: AppColor.primary, width: 1),
),
errorBorder: const OutlineInputBorder().copyWith(
borderRadius: BorderRadius.circular(8.r),
borderSide: const BorderSide(color: AppColor.red, width: 1.2),
),
errorStyle: const TextStyle().copyWith(
fontSize: 12.sp,
color: AppColor.red,
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
textStyle: TextStyle(
fontSize: 12.sp,
fontWeight: FontWeight.w600,
),
),
),
);
in MaterialApp Widget:
themeMode: ThemeMode.system,
theme: lightTheme,
issue:
The theme works perfectly fine in debug mode. However, when I build the app in release mode, the light theme does not seem to be applied correctly. The colors and styles
defined in the light theme are not reflected in the app when running in release mode.
I am using Flutter version (3.19.6) and Dart version (3.3.4)
What I have tried:
- put: in androidmanifest.xml
- Defined as static in a class
- used custom fonts (assets/fonts/)
- flutter clean / flutter pub get
- removed and added flutter again
Currently I am forced to write raw themes for every widgets, Although i have made reusable widgets in most cases, but that still does not make it easy
prior to flutter version 3.19.0 it was working perfectly fine in my projects.
Any help on this issue would be greatly appreciated. Thank you in advance.