Component theme normalization updates
Summary
#AppBarTheme
, BottomAppBarTheme
and InputDecorationTheme
were refactored to conform to Flutter's conventions for component themes. AppBarThemeData
, BottomAppBarThemeData
and InputDecorationThemeData
were added to define overrides for the defaults of the component visual properties. Releases of Flutter continue to normalize component themes like these for a more consistent theming experience in the material library.
Migration guide
#In ThemeData
:
- The type of the
appBarTheme
property has been changed fromAppBarTheme
toAppBarThemeData
. - The type of
bottomAppBarTheme
property has been changed fromBottomAppBarTheme
toBottomAppBarThemeData
. - The type of
inputDecorationTheme
property has been changed fromInputDecorationTheme
toInputDecorationThemeData
.
The return type of the component theme xTheme.of()
methods and Theme.of().xTheme
have also changed to xThemeData
.
In DatePickerThemeData
and TimePickerThemeData
, the type of the inputDecorationTheme
property has been changed from InputDecorationTheme
to InputDecorationThemeData
.
Code before migration:
final AppBarTheme appBarTheme = Theme.of(context).appBarTheme;
final AppBarTheme appBarTheme = AppBarTheme.of(context);
final BottomAppBarTheme bottomAppBarTheme = Theme.of(context).bottomAppBarTheme;
final BottomAppBarTheme bottomAppBarTheme = BottomAppBarTheme.of(context);
final InputDecorationTheme inputDecorationTheme = Theme.of(context).inputDecorationTheme;
final InputDecorationTheme inputDecorationTheme = InputDecorationTheme.of(context);
final InputDecorationTheme inputDecorationTheme = Theme.of(context).datePickerTheme.inputDecorationTheme;
final InputDecorationTheme inputDecorationTheme = Theme.of(context).timePickerTheme.inputDecorationTheme;
final ThemeData theme = ThemeData(
appBarTheme: AppBarTheme(),
bottomAppBarTheme: BottomAppBarTheme(),
inputDecorationTheme: InputDecorationTheme(),
);
final ThemeData theme = ThemeData().copyWith(
appBarTheme: AppBarTheme(),
bottomAppBarTheme: BottomAppBarTheme(),
inputDecorationTheme: InputDecorationTheme(),
);
const DatePickerThemeData datePickerTheme = DatePickerThemeData(inputDecorationTheme: InputDecorationTheme());
const TimePickerThemeData timePickerTheme = TimePickerThemeData(inputDecorationTheme: InputDecorationTheme());
Code after migration:
final AppBarThemeData appBarTheme = Theme.of(context).appBarTheme;
final AppBarThemeData appBarTheme = AppBarTheme.of(context);
final BottomAppBarThemeData bottomAppBarTheme = Theme.of(context).bottomAppBarTheme;
final BottomAppBarThemeData bottomAppBarTheme = BottomAppBarTheme.of(context);
final InputDecorationThemeData inputDecorationTheme = Theme.of(context).inputDecorationTheme;
final InputDecorationThemeData inputDecorationTheme = InputDecorationTheme.of(context);
final InputDecorationThemeData inputDecorationTheme = Theme.of(context).datePickerTheme.inputDecorationTheme;
final InputDecorationThemeData inputDecorationTheme = Theme.of(context).timePickerTheme.inputDecorationTheme;
final ThemeData theme = ThemeData(
appBarTheme: AppBarThemeData(),
bottomAppBarTheme: BottomAppBarThemeData(),
inputDecorationTheme: InputDecorationThemeData(),
);
final ThemeData theme = ThemeData().copyWith(
appBarTheme: AppBarThemeData(),
bottomAppBarTheme: BottomAppBarThemeData(),
inputDecorationTheme: InputDecorationThemeData(),
);
const DatePickerThemeData datePickerTheme = DatePickerThemeData(inputDecorationTheme: InputDecorationThemeData());
const TimePickerThemeData timePickerTheme = TimePickerThemeData(inputDecorationTheme: InputDecorationThemeData());
Timeline
#Landed in version: 3.33.0-1.0.pre
Stable release: Not yet
References
#API documentation:
Relevant PRs:
- Normalize ThemeData.appBarTheme
- Normalize ThemeData.bottomAppBarTheme
- Normalize InputDecorationTheme
- Apply normalization to TimePickerThemeData.inputDecorationTheme
Unless stated otherwise, the documentation on this site reflects the latest stable version of Flutter. Page last updated on 2025-07-09. View source or report an issue.