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
除非另有说明,本文档之所提及适用于 Flutter 的最新稳定版本,本页面最后更新时间: 2025-07-09。 查看文档源码 或者 为本页面内容提出建议.