Fix InputDecorator.prefixIcon color when disabled (#149595)

## 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 https://github.com/flutter/flutter/issues/149411.

## Tests

Updates 2 tests.
This commit is contained in:
Bruno Leroux 2024-06-03 20:53:16 +02:00 committed by GitHub
parent a92318dd98
commit e02d29d52e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 9 additions and 8 deletions

View File

@ -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,

1 Versions used 4_0_0
238 md.comp.filled-text-field.disabled.container.opacity
239 md.comp.filled-text-field.disabled.label-text.color
240 md.comp.filled-text-field.disabled.label-text.opacity
241 md.comp.filled-text-field.disabled.leading-icon.color
242 md.comp.filled-text-field.disabled.leading-icon.opacity
243 md.comp.filled-text-field.disabled.supporting-text.color
244 md.comp.filled-text-field.disabled.supporting-text.opacity
245 md.comp.filled-text-field.disabled.trailing-icon.color

View File

@ -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')};

View File

@ -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;
});

View File

@ -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);
});
@ -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);
});