Skip to content

Commit

Permalink
Fix InputDecorator.prefixIcon color when disabled (#149595)
Browse files Browse the repository at this point in the history
## Description

This PRs makes the `InputDecoration.prefixIcon` color compliant with the M3 spec.

From M3 spec, the color should be `onSurface.withOpacity(0.38)`, see https://m3.material.io/components/text-fields/specs#e4964192-72ad-414f-85b4-4b4357abb83c

![image](https://github.com/flutter/flutter/assets/840911/298d9aaf-fcda-479a-a8dd-0ee84db98242)

## Related Issue

Fixes flutter/flutter#149411.

## Tests

Updates 2 tests.
  • Loading branch information
bleroux authored Jun 3, 2024
1 parent a92318d commit e02d29d
Show file tree
Hide file tree
Showing 4 changed files with 9 additions and 8 deletions.
2 changes: 2 additions & 0 deletions dev/tools/gen_defaults/generated/used_tokens.csv
Original file line number Diff line number Diff line change
Expand Up @@ -238,6 +238,8 @@ md.comp.filled-text-field.disabled.container.color,
md.comp.filled-text-field.disabled.container.opacity,
md.comp.filled-text-field.disabled.label-text.color,
md.comp.filled-text-field.disabled.label-text.opacity,
md.comp.filled-text-field.disabled.leading-icon.color,
md.comp.filled-text-field.disabled.leading-icon.opacity,
md.comp.filled-text-field.disabled.supporting-text.color,
md.comp.filled-text-field.disabled.supporting-text.opacity,
md.comp.filled-text-field.disabled.trailing-icon.color,
Expand Down
4 changes: 2 additions & 2 deletions dev/tools/gen_defaults/lib/input_decorator_template.dart
Original file line number Diff line number Diff line change
Expand Up @@ -97,10 +97,10 @@ class _${blockName}DefaultsM3 extends InputDecorationTheme {
Color? get iconColor => ${componentColor("md.comp.filled-text-field.leading-icon")};
@override
Color? get prefixIconColor => MaterialStateColor.resolveWith((Set<MaterialState> states) {${componentColor('md.comp.filled-text-field.error.leading-icon') == componentColor('md.comp.filled-text-field.leading-icon') ? '' : '''
Color? get prefixIconColor => MaterialStateColor.resolveWith((Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return ${componentColor('md.comp.filled-text-field.disabled.leading-icon')};
}
}${componentColor('md.comp.filled-text-field.error.leading-icon') == componentColor('md.comp.filled-text-field.leading-icon') ? '' : '''
if (states.contains(MaterialState.error)) {
if (states.contains(MaterialState.hovered)) {
return ${componentColor('md.comp.filled-text-field.error.hover.leading-icon')};
Expand Down
3 changes: 3 additions & 0 deletions packages/flutter/lib/src/material/input_decorator.dart
Original file line number Diff line number Diff line change
Expand Up @@ -4736,6 +4736,9 @@ class _InputDecoratorDefaultsM3 extends InputDecorationTheme {

@override
Color? get prefixIconColor => MaterialStateColor.resolveWith((Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return _colors.onSurface.withOpacity(0.38);
}
return _colors.onSurfaceVariant;
});

Expand Down
8 changes: 2 additions & 6 deletions packages/flutter/test/material/input_decorator_test.dart
Original file line number Diff line number Diff line change
Expand Up @@ -5443,9 +5443,7 @@ void main() {
);

final ThemeData theme = Theme.of(tester.element(findPrefixIcon()));
// TODO(bleroux): based on M3 spec, it should be theme.colorScheme.onSurface.withOpacity(0.38).
// See https://github.com/flutter/flutter/issues/149411.
final Color expectedColor = theme.colorScheme.onSurfaceVariant;
final Color expectedColor = theme.colorScheme.onSurface.withOpacity(0.38);
expect(getPrefixIconStyle(tester).color, expectedColor);
});

Expand Down Expand Up @@ -5921,9 +5919,7 @@ void main() {
);

final ThemeData theme = Theme.of(tester.element(findPrefixIcon()));
// TODO(bleroux): based on M3 spec, it should be theme.colorScheme.onSurface.withOpacity(0.38).
// See https://github.com/flutter/flutter/issues/149411.
final Color expectedColor = theme.colorScheme.onSurfaceVariant;
final Color expectedColor = theme.colorScheme.onSurface.withOpacity(0.38);
expect(getPrefixIconStyle(tester).color, expectedColor);
});

Expand Down

0 comments on commit e02d29d

Please sign in to comment.