FloatingActionButton 和 ThemeData 的 accent 属性

移除了 Flutter 的 FloatingActionButton (FAB) 对 ThemeData accent 属性的依赖。

这是 Material 主题系统更新 项目的一小部分。

以前，ThemeData 的 accentIconTheme 属性仅由 FloatingActionButton 用于确定按钮内显示的文本或图标的默认颜色。

FloatingActionButton 也使用了 ThemeData accentTextTheme 属性，但是此依赖关系未记录且没有必要。

这两个依赖关系都令人困惑。例如，如果配置 Theme 的 accentIconTheme 来更改所有浮动操作按钮的外观，则很难知道哪些其他组件会受到影响，或者将来可能会受到影响。

Material Design 规范 不再包含“accent”颜色。ColorScheme 的 辅助色 现在用于替代。

以前，应用程序可以通过小部件的 foregroundColor 属性或 FloatingActionButtonTheme 的 foregroundColor 属性配置 FloatingActionButtons 中文本和图标的颜色。如果未指定任何 foregroundColor 属性，则前景颜色默认为 accentIconTheme 的颜色。

通过此更改，默认行为使用颜色方案的 onSecondary 颜色。

以前，accentIconTheme 为 FloatingActionButton 的 foregroundColor 属性提供默认值

    final Color foregroundColor = this.foregroundColor
      ?? floatingActionButtonTheme.foregroundColor
      ?? theme.accentIconTheme.color // To be removed.
      ?? theme.colorScheme.onSecondary;

通过配置其主题的 floatingActionButtonTheme 的 foregroundColor，可以获得与配置主题的 accentIconTheme 来有效配置所有浮动操作按钮的 foregroundColor 相同的效果的应用程序。

FloatingActionButton 的 foregroundColor 现在用于配置 FloatingActionButton 创建的 RawMaterialButton 的 textStyle。以前，此文本样式基于 ThemeData.accentTextTheme 的按钮样式

// theme.accentTextTheme becomes theme.textTheme
final TextStyle textStyle = theme.accentTextTheme.button.copyWith(
  color: foregroundColor,
  letterSpacing: 1.2,
);

除非应用程序已明确配置 accentTextTheme 以利用此未记录的依赖关系，否则此 accentTextTheme 的使用是不必要的。此更改将此 accentTextTheme 的使用替换为 textTheme。

此更改分两个步骤进行

1. 如果 FloatingActionButton 的前景设置为非默认颜色，则现在会打印警告。
2. accentIconTheme 依赖项已移除。如果您尚未执行此操作，请按照以下模式迁移您的应用程序。

要为所有 FAB 配置 FloatingActionButton 的 foregroundColor，您可以配置主题的 floatingActionButtonTheme 而不是其 accentIconTheme。

迁移前代码

MaterialApp(
  theme: ThemeData(
    accentIconTheme: IconThemeData(color: Colors.red),
  ),
)

迁移后代码

MaterialApp(
  theme: ThemeData(
    floatingActionButtonTheme: FloatingActionButtonThemeData(
      foregroundColor: Colors.red,
    ),
  ),
)

包含在版本中：1.16.3
稳定版发布：1.17

设计文档

• 移除 FAB Accent 主题依赖

API 文档

• FloatingActionButton
• ThemeData
• FloatingActionButtonThemeData

相关 PR

• 步骤 1/2 警告 Flutter 的 FloatingActionButton 对 ThemeData accent 属性的依赖
• 步骤 2/2 移除 Flutter 的 FloatingActionButton 对 ThemeData accent 属性的依赖

其他

• Material 主题系统更新

除非另有说明，否则本网站上的文档反映了 Flutter 的最新稳定版本。页面上次更新于 2024-04-04。 查看源代码 或 报告问题.