Repository navigation
ButtonStyle: foregroundColor no longer controls icon color, contradicting dartdocs #154644
Description
Steps to reproduce
- Make a
FilledButton.iconwith an icon and a label, andstyle: const ButtonStyle(foregroundColor: WidgetStatePropertyAll(Colors.orange)). - See the color of the icon and the label.
- Read the dartdocs on
ButtonStyle.foregroundColorandButtonStyle.iconColor:
/// The color for the button's [Text] and [Icon] widget descendants.
///
/// This color is typically used instead of the color of the [textStyle]. All
/// of the components that compute defaults from [ButtonStyle] values
/// compute a default [foregroundColor] and use that instead of the
/// [textStyle]'s color.
final MaterialStateProperty<Color?>? foregroundColor; /// The icon's color inside of the button.
///
/// If this is null, the icon color will be [foregroundColor].
final MaterialStateProperty<Color?>? iconColor;Expected results
The icon and the label should be orange. Or, those dartdocs should not say that ButtonStyle.foregroundColor controls the icon color when iconColor is null.
Actual results
The label is orange, but the icon is not.
The reason: starting with 51ed348 (from #143501), the behavior for iconColor: null is to color the icon with a hard-coded default, instead of using foregroundColor.
See before/after this change in screenshots below.
At the same time, the quoted dartdocs still say that ButtonStyle.foregroundColor controls the icon color when iconColor is null.
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Center(
child: FilledButton.icon(onPressed: () {},
style: const ButtonStyle(foregroundColor: WidgetStatePropertyAll(Colors.orange)),
label: const Text('Icon button'),
icon: const Icon(Icons.save))));
}
}Screenshots or Video
Logs
Logs
No unusual log output expected or observed.
Flutter Doctor output
Doctor output
Doctor summary (to see all details, run flutter doctor -v):
[!] Flutter (Channel [user-branch], 3.24.0-1.0.pre.428, on macOS 14.6.1 23G93 darwin-arm64, locale en-US)
! Flutter version 3.24.0-1.0.pre.428 on channel [user-branch] at /Users/chrisbobbe/.local/lib/flutter
Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
If that doesn't fix the issue, reinstall Flutter by following instructions at https://flutter.dev/setup.
! Upstream repository unknown source is not a standard remote.
Set environment variable "FLUTTER_GIT_URL" to unknown source to dismiss this error.
[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2024.1)
[✓] VS Code (version 1.92.2)
[✓] Connected device (5 available)
[✓] Network resources
! Doctor found issues in 1 category.
Activity
chrisbobbe commentedon Sep 4, 2024
I'm not sure whether it's better to change the behavior or update the doc. Updating the doc seems easier, at least, so I plan to go ahead and open a PR for that.
cc @gspencergoog @HansMuller @QuncCccccc as author/reviewers of #143501.
gspencergoog commentedon Sep 4, 2024
Yes, updating the doc is the right thing. The Material tokens specify them separately, so they should be independent.
chrisbobbe commentedon Sep 4, 2024
Thanks for the prompt reply! Just sent #154646 for this.
darshankawar commentedon Sep 5, 2024
Thanks for the report and potential fix @chrisbobbe
Verified that this seems to occuring in master version only, as, on latest stable, it works as expected.
Master version: 3.25.0-1.0.pre.269gspencergoog commentedon Sep 5, 2024
Actually, they're both working as expected: #143501 was intended to change behavior.
Adjust ButtonStyle.{foreground,icon}Color dartdocs for new behavior (#…
msglist: Fix mark-as-read button icon color in dark mode
github-actions commentedon Sep 23, 2024
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 -vand a minimal reproduction of the issue.