Skip to content

Conversation

HansMuller
Copy link
Contributor

@HansMuller HansMuller commented Dec 13, 2019

Remove FloatingActionButton's dependency on the ThemeData accentIconTheme and accentTextTheme properties. Apps can configure the appearance of FloatingActionButtons using the theme's FloatingActionButtonTheme instead.

Step 1 of this change was #48435.

Context

This is a small part of the "Update Material Theme System" project, flutter.dev/go/material-theme-system-updates.

Currently, the ThemeData accentIconTheme property is only used by FloatingActionButton. It's the default color of the text or icons that appear within the button.

FloatingActionButton also uses ThemeData accentTextTheme property, however this dependency is undocumented and unnecessary.

Both of these dependencies are apt to be confusing. For example if one configures the Theme's accentIconTheme to change the appearance of floating action buttons, it's difficult to know what other components will be affected. Or might be affected in the future.

The Material Design spec no longer includes an "accent" color. The ColorScheme's secondary color is now used instead.

Currently applications can configure the color of text and icons within FloatingActionButtons with the widget's foregroundColor property or with the FloatingActionButtonTheme's foregroundColor. If neither foregroundColor property is specified the foreground color currently defaults to the accentIconTheme's color. This PR will cause the default to be the color scheme's onSecondary color instead.

Description of change

Currently the accentIconTheme provides a default for the FloatingActionButton's foregroundColor property:

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

Apps that currently configure their theme's accentIconTheme to effectively configure the foregroundColor of all floating action buttons, can get the same effect by configuring the foregroundColor of their theme's floatingActionButtonTheme. This PR removes the line that contains accentIconTheme.

The FloatingActionButton's foregroundColor is used to configure the textStyle of the RawMaterialButton created by FloatingActionButton. Currently, this text style is based on the button style of ThemeData.accentTextTheme:

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

Except in a case where an app has explicitly configured the accentTextTheme to take advantage of this undocumented dependency, this use of accentTextTheme is unnecessary. This PR replaces this use of accentTextTheme with textTheme.

Migration guide

To configure the FloatingActionButton's foregroundColor for all FABs, apps can configure the theme's floatingActionButtonTheme instead of its accentIconTheme.

Before

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

After

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

@fluttergithubbot fluttergithubbot added f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels. labels Dec 13, 2019
@HansMuller HansMuller changed the title Remove FloatingActionButton accent dependencies Remove Flutter's FloatingActionButton dependency on ThemeData accent properties Jan 3, 2020
@HansMuller HansMuller changed the title Remove Flutter's FloatingActionButton dependency on ThemeData accent properties Step 2 of 2: Remove Flutter's FloatingActionButton dependency on ThemeData accent properties Jan 8, 2020
@HansMuller HansMuller force-pushed the remove_fab_accent_dep branch from 0c10e4c to 306ef29 Compare January 15, 2020 19:11
@HansMuller HansMuller merged commit 6006c23 into flutter:master Jan 16, 2020
@HansMuller HansMuller deleted the remove_fab_accent_dep branch January 16, 2020 15:21
@gspencergoog
Copy link
Contributor

LGTM!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants