FloatingActionButton backgroundColor defaults to accentColor, foregroundColor also to accentColor.

[erikkubica]

Steps to Reproduce

I don´t know if it´s my inability to understand all those "primary,accent,swatch,normal,..." color configurations, but i will try to explain what my problem is. I personally think it´s more like a bug or a missing feature than a question for stackoverflow.

Try this code:
https://gist.github.com/erikkubica/45fc8acdce1f8a25cd5258e8b3a0e1f3

Or:

1. Create an app where you will use primary red color (appbar, button bg, card), yellow for accent (icons, appbar title), black for general text, white/light grey for backgrounds like scaffold body.
2. Set AppBar BG color to red using using theme (primaryColor)
3. Set AppBar title color to yellow using theme (accentColor)
4. Set color of icons to same color as accentColor, since if primary color is used they will be invisible in AppBar
5. Create a floatingActionButton with an icon.
6. Icon in floatingActionButton is not visible because backgroundColor for the widget uses the ThemeData.accentColor, which is yellow, instead of the ThemeData.primaryColor

Both foreground and background defaults to accentColor.

 /// The color to use when filling the button.
 ///
 /// Defaults to **[ThemeData.accentColor**] for the current theme.
 final Color backgroundColor;

I found similar issue with FlatButton in Dialog, by default color of text is accent color, which is yellow (on white background), if i override it to primary, it´s red, but I don´t want to have it red since the delete button next to it is red. So I need to set it to normal, so it´s black which is correct, but:

flat_button.dart:127

 textStyle: theme.textTheme.button.copyWith(color: buttonTheme.getTextColor(this)),

My theme:

buttonTheme: ButtonThemeData(
            textTheme: ButtonTextTheme.normal,
            buttonColor: primary, // Red
          ),

textTheme: TextTheme(
           ...
            button: TextStyle(color: black), // Black
          ),

new FlatButton(
              //textTheme: ButtonTextTheme.normal,
              child: new Text("Ponechať"),
              onPressed: () {
                Navigator.of(context).pop();
                onKeep();
              },
            )

In theory my FlatButton in the popup dialog should be black and or red. But it´s yellow the accent color.

Analyzing [censored]...

   info - This class inherits from a class marked as @immutable, and therefore should be immutable (all instance fields must be final) - lib\widgets\general\[censored]AppBar.dart:4:7 - must_be_immutable

1 issue found. (ran in 9.7s)

[√] Flutter (Channel stable, v1.0.0, on Microsoft Windows [Version 10.0.17134.523], locale sk-SK)
    • Flutter version 1.0.0 at C:\flutter
    • Framework revision 5391447fae (3 months ago), 2018-11-29 19:41:26 -0800
    • Engine revision 7375a0f414
    • Dart version 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)

[√] Android toolchain - develop for Android devices (Android SDK 28.0.3)
    • Android SDK at C:\Users\erikk\AppData\Local\Android\sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-28, build-tools 28.0.3
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1136-b06)
    • All Android licenses accepted.

[√] Android Studio (version 3.2)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin version 31.3.1
    • Dart plugin version 181.5656
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1136-b06)

[√] VS Code (version 1.31.1)
    • VS Code at C:\Users\erikk\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 2.22.3

[√] Connected device (1 available)
    • SM G950F • 988a163739344f4956 • android-arm64 • Android 8.0.0 (API 26)

• No issues found!

Thank you, so far I am loving Flutter

[zoechi]

Please consider asking support questions in one of the other channels listed at http://flutter.io/support .

[erikkubica]

@zoechi Button default text color is solved using colorScheme.light(secodary:..).

For floatingActionButton I still think it's a bug/missing feature because of inability to set it's background from ThemeData. The only way of setting it in theme data is using accent color, which is sorry but stupid, because accent color is usually same color as icons, and the action button contains only icon, so the colors are the same. Look at gmail app, or other apps, Most of them use primary color as background for widgets and secondary/accent for icons. Accent should contrast with primary. If both colors in case of the floatingActionButton are accent colors there is no way they can contrast, since they are the same color.

So I am suggesting to tag this ticket as feature request and/or possible bug that needs to be investigated if it's a bug or not according to material guidelines.

I have also updated the ticket with a link to gist where it can be "reproduced" tested.

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.