M3 - Fix Chip icon and label colors (#140573)

This commit is contained in:
David Martos 2024-01-31 01:28:31 +01:00 committed by GitHub
parent 1f573e022e
commit 20dc5cbc6c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 244 additions and 66 deletions

View file

@ -324,6 +324,7 @@ md.comp.filled-tonal-icon-button.toggle.unselected.pressed.state-layer.color,
md.comp.filled-tonal-icon-button.unselected.container.color,
md.comp.filter-chip.container.shape,
md.comp.filter-chip.container.surface-tint-layer.color,
md.comp.filter-chip.disabled.label-text.color,
md.comp.filter-chip.elevated.container.elevation,
md.comp.filter-chip.elevated.container.shadow-color,
md.comp.filter-chip.elevated.disabled.container.color,
@ -340,10 +341,15 @@ md.comp.filter-chip.flat.selected.container.color,
md.comp.filter-chip.flat.unselected.outline.color,
md.comp.filter-chip.flat.unselected.outline.width,
md.comp.filter-chip.label-text.text-style,
md.comp.filter-chip.selected.label-text.color,
md.comp.filter-chip.unselected.label-text.color,
md.comp.filter-chip.with-icon.icon.size,
md.comp.filter-chip.with-leading-icon.disabled.leading-icon.color,
md.comp.filter-chip.with-leading-icon.selected.leading-icon.color,
md.comp.filter-chip.with-leading-icon.unselected.leading-icon.color,
md.comp.filter-chip.with-trailing-icon.disabled.trailing-icon.color,
md.comp.filter-chip.with-trailing-icon.selected.trailing-icon.color,
md.comp.filter-chip.with-trailing-icon.unselected.trailing-icon.color,
md.comp.full-screen-dialog.container.color,
md.comp.icon-button.disabled.icon.color,
md.comp.icon-button.disabled.icon.opacity,
@ -366,17 +372,24 @@ md.comp.icon-button.unselected.pressed.state-layer.color,
md.comp.icon-button.unselected.pressed.state-layer.opacity,
md.comp.input-chip.container.elevation,
md.comp.input-chip.container.shape,
md.comp.input-chip.disabled.label-text.color,
md.comp.input-chip.disabled.selected.container.color,
md.comp.input-chip.disabled.selected.container.opacity,
md.comp.input-chip.disabled.unselected.outline.color,
md.comp.input-chip.disabled.unselected.outline.opacity,
md.comp.input-chip.label-text.text-style,
md.comp.input-chip.selected.container.color,
md.comp.input-chip.selected.label-text.color,
md.comp.input-chip.unselected.label-text.color,
md.comp.input-chip.unselected.outline.color,
md.comp.input-chip.unselected.outline.width,
md.comp.input-chip.with-leading-icon.disabled.leading-icon.color,
md.comp.input-chip.with-leading-icon.leading-icon.size,
md.comp.input-chip.with-leading-icon.selected.leading-icon.color,
md.comp.input-chip.with-leading-icon.unselected.leading-icon.color,
md.comp.input-chip.with-trailing-icon.disabled.trailing-icon.color,
md.comp.input-chip.with-trailing-icon.selected.trailing-icon.color,
md.comp.input-chip.with-trailing-icon.unselected.trailing-icon.color,
md.comp.linear-progress-indicator.active-indicator.color,
md.comp.linear-progress-indicator.track.color,
md.comp.linear-progress-indicator.track.height,

1 Versions used, v0_162, v0_202, v0_158
324 md.comp.filled-tonal-icon-button.unselected.container.color,
325 md.comp.filter-chip.container.shape,
326 md.comp.filter-chip.container.surface-tint-layer.color,
327 md.comp.filter-chip.disabled.label-text.color,
328 md.comp.filter-chip.elevated.container.elevation,
329 md.comp.filter-chip.elevated.container.shadow-color,
330 md.comp.filter-chip.elevated.disabled.container.color,
341 md.comp.filter-chip.flat.unselected.outline.color,
342 md.comp.filter-chip.flat.unselected.outline.width,
343 md.comp.filter-chip.label-text.text-style,
344 md.comp.filter-chip.selected.label-text.color,
345 md.comp.filter-chip.unselected.label-text.color,
346 md.comp.filter-chip.with-icon.icon.size,
347 md.comp.filter-chip.with-leading-icon.disabled.leading-icon.color,
348 md.comp.filter-chip.with-leading-icon.selected.leading-icon.color,
349 md.comp.filter-chip.with-leading-icon.unselected.leading-icon.color,
350 md.comp.filter-chip.with-trailing-icon.disabled.trailing-icon.color,
351 md.comp.filter-chip.with-trailing-icon.selected.trailing-icon.color,
352 md.comp.filter-chip.with-trailing-icon.unselected.trailing-icon.color,
353 md.comp.full-screen-dialog.container.color,
354 md.comp.icon-button.disabled.icon.color,
355 md.comp.icon-button.disabled.icon.opacity,
372 md.comp.icon-button.unselected.pressed.state-layer.opacity,
373 md.comp.input-chip.container.elevation,
374 md.comp.input-chip.container.shape,
375 md.comp.input-chip.disabled.label-text.color,
376 md.comp.input-chip.disabled.selected.container.color,
377 md.comp.input-chip.disabled.selected.container.opacity,
378 md.comp.input-chip.disabled.unselected.outline.color,
379 md.comp.input-chip.disabled.unselected.outline.opacity,
380 md.comp.input-chip.label-text.text-style,
381 md.comp.input-chip.selected.container.color,
382 md.comp.input-chip.selected.label-text.color,
383 md.comp.input-chip.unselected.label-text.color,
384 md.comp.input-chip.unselected.outline.color,
385 md.comp.input-chip.unselected.outline.width,
386 md.comp.input-chip.with-leading-icon.disabled.leading-icon.color,
387 md.comp.input-chip.with-leading-icon.leading-icon.size,
388 md.comp.input-chip.with-leading-icon.selected.leading-icon.color,
389 md.comp.input-chip.with-leading-icon.unselected.leading-icon.color,
390 md.comp.input-chip.with-trailing-icon.disabled.trailing-icon.color,
391 md.comp.input-chip.with-trailing-icon.selected.trailing-icon.color,
392 md.comp.input-chip.with-trailing-icon.unselected.trailing-icon.color,
393 md.comp.linear-progress-indicator.active-indicator.color,
394 md.comp.linear-progress-indicator.track.color,
395 md.comp.linear-progress-indicator.track.height,

View file

@ -43,7 +43,13 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
double? get pressElevation => ${elevation("$tokenGroup$elevatedVariant.pressed.container")};
@override
TextStyle? get labelStyle => ${textStyle("$tokenGroup.label-text")};
TextStyle? get labelStyle => ${textStyle("$tokenGroup.label-text")}?.copyWith(
color: isEnabled
? isSelected
? ${color("$tokenGroup.selected.label-text.color")}
: ${color("$tokenGroup.unselected.label-text.color")}
: ${color("$tokenGroup.disabled.label-text.color")},
);
@override
MaterialStateProperty<Color?>? get color =>
@ -77,10 +83,18 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => ${colorOrTransparent("$tokenGroup.container.surface-tint-layer.color")};
@override
Color? get checkmarkColor => ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")};
Color? get checkmarkColor => isEnabled
? isSelected
? ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.unselected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.disabled.leading-icon.color")};
@override
Color? get deleteIconColor => ${color("$tokenGroup.with-trailing-icon.selected.trailing-icon.color")};
Color? get deleteIconColor => isEnabled
? isSelected
? ${color("$tokenGroup.with-trailing-icon.selected.trailing-icon.color")}
: ${color("$tokenGroup.with-trailing-icon.unselected.trailing-icon.color")}
: ${color("$tokenGroup.with-trailing-icon.disabled.trailing-icon.color")};
@override
BorderSide? get side => _chipVariant == _ChipVariant.flat && !isSelected
@ -92,7 +106,9 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
@override
IconThemeData? get iconTheme => IconThemeData(
color: isEnabled
? ${color("$tokenGroup.with-icon.icon.color")}
? isSelected
? ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.unselected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.disabled.leading-icon.color")},
size: ${getToken("$tokenGroup.with-icon.icon.size")},
);

View file

@ -30,7 +30,13 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
late final TextTheme _textTheme = Theme.of(context).textTheme;
@override
TextStyle? get labelStyle => ${textStyle("$tokenGroup.label-text")};
TextStyle? get labelStyle => ${textStyle("$tokenGroup.label-text")}?.copyWith(
color: isEnabled
? isSelected
? ${color("$tokenGroup.selected.label-text.color")}
: ${color("$tokenGroup.unselected.label-text.color")}
: ${color("$tokenGroup.disabled.label-text.color")},
);
@override
MaterialStateProperty<Color?>? get color =>
@ -54,10 +60,18 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => ${colorOrTransparent("$tokenGroup.container.surface-tint-layer.color")};
@override
Color? get checkmarkColor => ${color("$tokenGroup.with-icon.selected.icon.color")};
Color? get checkmarkColor => isEnabled
? isSelected
? ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.unselected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.disabled.leading-icon.color")};
@override
Color? get deleteIconColor => ${color("$tokenGroup.with-trailing-icon.selected.trailing-icon.color")};
Color? get deleteIconColor => isEnabled
? isSelected
? ${color("$tokenGroup.with-trailing-icon.selected.trailing-icon.color")}
: ${color("$tokenGroup.with-trailing-icon.unselected.trailing-icon.color")}
: ${color("$tokenGroup.with-trailing-icon.disabled.trailing-icon.color")};
@override
BorderSide? get side => !isSelected
@ -69,7 +83,9 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
@override
IconThemeData? get iconTheme => IconThemeData(
color: isEnabled
? ${color("$tokenGroup.with-leading-icon.leading-icon.color")}
? isSelected
? ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.unselected.leading-icon.color")}
: ${color("$tokenGroup.with-leading-icon.disabled.leading-icon.color")},
size: ${getToken("$tokenGroup.with-leading-icon.leading-icon.size")},
);

View file

@ -272,7 +272,13 @@ class _ChoiceChipDefaultsM3 extends ChipThemeData {
double? get pressElevation => 1.0;
@override
TextStyle? get labelStyle => _textTheme.labelLarge;
TextStyle? get labelStyle => _textTheme.labelLarge?.copyWith(
color: isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.onSurfaceVariant
: _colors.onSurface,
);
@override
MaterialStateProperty<Color?>? get color =>
@ -306,10 +312,18 @@ class _ChoiceChipDefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => _colors.surfaceTint;
@override
Color? get checkmarkColor => _colors.onSecondaryContainer;
Color? get checkmarkColor => isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.primary
: _colors.onSurface;
@override
Color? get deleteIconColor => _colors.onSecondaryContainer;
Color? get deleteIconColor => isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.onSurfaceVariant
: _colors.onSurface;
@override
BorderSide? get side => _chipVariant == _ChipVariant.flat && !isSelected
@ -321,7 +335,9 @@ class _ChoiceChipDefaultsM3 extends ChipThemeData {
@override
IconThemeData? get iconTheme => IconThemeData(
color: isEnabled
? null
? isSelected
? _colors.onSecondaryContainer
: _colors.primary
: _colors.onSurface,
size: 18.0,
);

View file

@ -298,7 +298,13 @@ class _FilterChipDefaultsM3 extends ChipThemeData {
double? get pressElevation => 1.0;
@override
TextStyle? get labelStyle => _textTheme.labelLarge;
TextStyle? get labelStyle => _textTheme.labelLarge?.copyWith(
color: isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.onSurfaceVariant
: _colors.onSurface,
);
@override
MaterialStateProperty<Color?>? get color =>
@ -332,10 +338,18 @@ class _FilterChipDefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => _colors.surfaceTint;
@override
Color? get checkmarkColor => _colors.onSecondaryContainer;
Color? get checkmarkColor => isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.primary
: _colors.onSurface;
@override
Color? get deleteIconColor => _colors.onSecondaryContainer;
Color? get deleteIconColor => isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.onSurfaceVariant
: _colors.onSurface;
@override
BorderSide? get side => _chipVariant == _ChipVariant.flat && !isSelected
@ -347,7 +361,9 @@ class _FilterChipDefaultsM3 extends ChipThemeData {
@override
IconThemeData? get iconTheme => IconThemeData(
color: isEnabled
? null
? isSelected
? _colors.onSecondaryContainer
: _colors.primary
: _colors.onSurface,
size: 18.0,
);

View file

@ -263,7 +263,13 @@ class _InputChipDefaultsM3 extends ChipThemeData {
late final TextTheme _textTheme = Theme.of(context).textTheme;
@override
TextStyle? get labelStyle => _textTheme.labelLarge;
TextStyle? get labelStyle => _textTheme.labelLarge?.copyWith(
color: isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.onSurfaceVariant
: _colors.onSurface,
);
@override
MaterialStateProperty<Color?>? get color =>
@ -287,10 +293,18 @@ class _InputChipDefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => Colors.transparent;
@override
Color? get checkmarkColor => null;
Color? get checkmarkColor => isEnabled
? isSelected
? _colors.primary
: _colors.onSurfaceVariant
: _colors.onSurface;
@override
Color? get deleteIconColor => _colors.onSecondaryContainer;
Color? get deleteIconColor => isEnabled
? isSelected
? _colors.onSecondaryContainer
: _colors.onSurfaceVariant
: _colors.onSurface;
@override
BorderSide? get side => !isSelected
@ -302,7 +316,9 @@ class _InputChipDefaultsM3 extends ChipThemeData {
@override
IconThemeData? get iconTheme => IconThemeData(
color: isEnabled
? null
? isSelected
? _colors.primary
: _colors.onSurfaceVariant
: _colors.onSurface,
size: 18.0,
);

View file

@ -204,7 +204,7 @@ void main() {
// Test default label style.
expect(
getLabelStyle(tester, label).style.color!.value,
theme.textTheme.labelLarge!.color!.value,
theme.colorScheme.onSurfaceVariant.value,
);
Material chipMaterial = getMaterial(tester);
@ -339,7 +339,7 @@ void main() {
// Test default label style.
expect(
getLabelStyle(tester, label).style.color!.value,
theme.textTheme.labelLarge!.color!.value,
theme.colorScheme.onSurfaceVariant.value,
);
Material chipMaterial = getMaterial(tester);
@ -691,8 +691,11 @@ void main() {
});
testWidgets('ChoiceChip uses provided iconTheme', (WidgetTester tester) async {
final ThemeData theme = ThemeData();
Widget buildChip({ IconThemeData? iconTheme }) {
return MaterialApp(
theme: theme,
home: Material(
child: ChoiceChip(
iconTheme: iconTheme,
@ -708,7 +711,7 @@ void main() {
// Test default icon theme.
await tester.pumpWidget(buildChip());
expect(getIconData(tester).color, ThemeData().iconTheme.color);
expect(getIconData(tester).color, theme.colorScheme.primary);
// Test provided icon theme.
await tester.pumpWidget(buildChip(iconTheme: const IconThemeData(color: Color(0xff00ff00))));

View file

@ -19,11 +19,10 @@ Widget wrapForChip({
required Widget child,
TextDirection textDirection = TextDirection.ltr,
TextScaler textScaler = TextScaler.noScaling,
Brightness brightness = Brightness.light,
bool? useMaterial3,
ThemeData? theme,
}) {
return MaterialApp(
theme: ThemeData(brightness: brightness, useMaterial3: useMaterial3),
theme: theme,
home: Directionality(
textDirection: textDirection,
child: MediaQuery(
@ -38,13 +37,11 @@ Future<void> pumpCheckmarkChip(
WidgetTester tester, {
required Widget chip,
Color? themeColor,
Brightness brightness = Brightness.light,
bool? useMaterial3,
ThemeData? theme,
}) async {
await tester.pumpWidget(
wrapForChip(
useMaterial3: useMaterial3,
brightness: brightness,
theme: theme,
child: Builder(
builder: (BuildContext context) {
final ChipThemeData chipTheme = ChipTheme.of(context);
@ -272,7 +269,7 @@ void main() {
// Test default label style.
expect(
getLabelStyle(tester, label).style.color!.value,
theme.textTheme.labelLarge!.color!.value,
theme.colorScheme.onSurfaceVariant.value,
);
Material chipMaterial = getMaterial(tester);
@ -407,7 +404,7 @@ void main() {
// Test default label style.
expect(
getLabelStyle(tester, 'filter chip').style.color!.value,
theme.textTheme.labelLarge!.color!.value,
theme.colorScheme.onSurfaceVariant.value,
);
Material chipMaterial = getMaterial(tester);
@ -708,7 +705,7 @@ void main() {
await pumpCheckmarkChip(
tester,
chip: selectedFilterChip(),
useMaterial3: false,
theme: ThemeData(useMaterial3: false),
);
expectCheckmarkColor(find.byType(FilterChip), Colors.black.withAlpha(0xde));
@ -719,7 +716,7 @@ void main() {
await pumpCheckmarkChip(
tester,
chip: selectedFilterChip(),
useMaterial3: theme.useMaterial3,
theme: theme,
);
expectCheckmarkColor(
@ -732,8 +729,7 @@ void main() {
await pumpCheckmarkChip(
tester,
chip: selectedFilterChip(),
brightness: Brightness.dark,
useMaterial3: false,
theme: ThemeData.dark(useMaterial3: false),
);
expectCheckmarkColor(
@ -747,8 +743,7 @@ void main() {
await pumpCheckmarkChip(
tester,
chip: selectedFilterChip(),
brightness: theme.brightness,
useMaterial3: theme.useMaterial3,
theme: theme,
);
expectCheckmarkColor(
@ -833,8 +828,11 @@ void main() {
});
testWidgets('FilterChip uses provided iconTheme', (WidgetTester tester) async {
final ThemeData theme = ThemeData();
Widget buildChip({ IconThemeData? iconTheme }) {
return MaterialApp(
theme: theme,
home: Material(
child: FilterChip(
iconTheme: iconTheme,
@ -849,7 +847,7 @@ void main() {
// Test default icon theme.
await tester.pumpWidget(buildChip());
expect(getIconData(tester).color, ThemeData().iconTheme.color);
expect(getIconData(tester).color, theme.colorScheme.primary);
// Test provided icon theme.
await tester.pumpWidget(buildChip(iconTheme: const IconThemeData(color: Color(0xff00ff00))));
@ -880,7 +878,7 @@ void main() {
// Test the delete button icon.
expect(tester.getSize(find.byIcon(Icons.clear)), const Size(18.0, 18.0));
expect(getIconData(tester).color, theme.colorScheme.onSecondaryContainer);
expect(getIconData(tester).color, theme.colorScheme.onSurfaceVariant);
await tester.pumpWidget(
MaterialApp(
@ -906,7 +904,7 @@ void main() {
// Test the delete button icon.
expect(tester.getSize(find.byIcon(Icons.clear)), const Size(18.0, 18.0));
expect(getIconData(tester).color, theme.colorScheme.onSecondaryContainer);
expect(getIconData(tester).color, theme.colorScheme.onSurfaceVariant);
}, skip: kIsWeb && !isCanvasKit); // https://github.com/flutter/flutter/issues/99933
testWidgets('Material2 - FilterChip supports delete button', (WidgetTester tester) async {
@ -1093,4 +1091,83 @@ void main() {
// Delete button tooltip should not be visible.
expect(findTooltipContainer('Delete'), findsNothing);
});
testWidgets('Material3 - Default FilterChip icon colors', (WidgetTester tester) async {
const IconData flatAvatar = Icons.favorite;
const IconData flatDeleteIcon = Icons.delete;
const IconData elevatedAvatar = Icons.house;
const IconData elevatedDeleteIcon = Icons.clear_all;
final ThemeData theme = ThemeData();
Widget buildChips({ required bool selected }) {
return MaterialApp(
theme: theme,
home: Material(
child: Column(
children: <Widget>[
FilterChip(
avatar: const Icon(flatAvatar),
deleteIcon: const Icon(flatDeleteIcon),
onSelected: (bool valueChanged) { },
label: const Text('FilterChip'),
selected: selected,
onDeleted: () { },
),
FilterChip.elevated(
avatar: const Icon(elevatedAvatar),
deleteIcon: const Icon(elevatedDeleteIcon),
onSelected: (bool valueChanged) { },
label: const Text('Elevated FilterChip'),
selected: selected,
onDeleted: () { },
),
],
),
),
);
}
Color getIconColor(WidgetTester tester, IconData icon) {
return tester.firstWidget<IconTheme>(find.ancestor(
of: find.byIcon(icon),
matching: find.byType(IconTheme),
)).data.color!;
}
// Test unselected state.
await tester.pumpWidget(buildChips(selected: false));
// Check the flat chip icon colors.
expect(getIconColor(tester, flatAvatar), theme.colorScheme.primary);
expect(
getIconColor(tester, flatDeleteIcon),
theme.colorScheme.onSurfaceVariant,
);
// Check the elevated chip icon colors.
expect(getIconColor(tester, elevatedAvatar), theme.colorScheme.primary);
expect(
getIconColor(tester, elevatedDeleteIcon),
theme.colorScheme.onSurfaceVariant,
);
// Test selected state.
await tester.pumpWidget(buildChips(selected: true));
// Check the flat chip icon colors.
expect(
getIconColor(tester, flatAvatar),
theme.colorScheme.onSecondaryContainer,
);
expect(
getIconColor(tester, flatDeleteIcon),
theme.colorScheme.onSecondaryContainer,
);
// Check the elevated chip icon colors.
expect(
getIconColor(tester, elevatedAvatar),
theme.colorScheme.onSecondaryContainer,
);
expect(
getIconColor(tester, elevatedDeleteIcon),
theme.colorScheme.onSecondaryContainer,
);
});
}

View file

@ -16,11 +16,10 @@ Widget wrapForChip({
required Widget child,
TextDirection textDirection = TextDirection.ltr,
double textScaleFactor = 1.0,
Brightness brightness = Brightness.light,
bool? useMaterial3,
ThemeData? theme,
}) {
return MaterialApp(
theme: ThemeData(brightness: brightness, useMaterial3: useMaterial3),
theme: theme,
home: Directionality(
textDirection: textDirection,
child: MediaQuery.withClampedTextScaling(
@ -40,6 +39,10 @@ Widget selectedInputChip({
label: const Text('InputChip'),
selected: true,
isEnabled: enabled,
// When [enabled] is true we also need to provide one of the chip
// callbacks, otherwise the chip would have a 'disabled'
// [MaterialState], which is not the intention.
onSelected: enabled ? (_) {} : null,
showCheckmark: true,
checkmarkColor: checkmarkColor,
);
@ -50,13 +53,11 @@ Future<void> pumpCheckmarkChip(
WidgetTester tester, {
required Widget chip,
Color? themeColor,
Brightness brightness = Brightness.light,
bool? useMaterial3,
ThemeData? theme,
}) async {
await tester.pumpWidget(
wrapForChip(
useMaterial3: useMaterial3,
brightness: brightness,
theme: theme,
child: Builder(
builder: (BuildContext context) {
final ChipThemeData chipTheme = ChipTheme.of(context);
@ -304,41 +305,42 @@ void main() {
focusNode2.dispose();
});
testWidgets('Material2 - Input chip check mark color is determined by platform brightness when light', (WidgetTester tester) async {
testWidgets('Material2 - Input chip disabled check mark color is determined by platform brightness when light', (WidgetTester tester) async {
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(),
useMaterial3: false,
theme: ThemeData(useMaterial3: false),
);
expectCheckmarkColor(find.byType(InputChip), Colors.black.withAlpha(0xde));
});
testWidgets('Material3 - Input chip check mark color is determined by platform brightness when light', (WidgetTester tester) async {
await pumpCheckmarkChip(tester, chip: selectedInputChip());
testWidgets('Material3 - Input chip disabled check mark color is determined by platform brightness when light', (WidgetTester tester) async {
final ThemeData theme = ThemeData();
await pumpCheckmarkChip(tester, chip: selectedInputChip(), theme: theme);
expectCheckmarkColor(find.byType(InputChip), Colors.black.withAlpha(0xde));
expectCheckmarkColor(find.byType(InputChip), theme.colorScheme.onSurface);
});
testWidgets('Material2 - Input chip check mark color is determined by platform brightness when dark', (WidgetTester tester) async {
testWidgets('Material2 - Input chip disabled check mark color is determined by platform brightness when dark', (WidgetTester tester) async {
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(),
brightness: Brightness.dark,
useMaterial3: false,
theme: ThemeData.dark(useMaterial3: false),
);
expectCheckmarkColor(find.byType(InputChip), Colors.white.withAlpha(0xde));
});
testWidgets('Material3 - Input chip check mark color is determined by platform brightness when dark', (WidgetTester tester) async {
testWidgets('Material3 - Input chip disabled check mark color is determined by platform brightness when dark', (WidgetTester tester) async {
final ThemeData theme = ThemeData.dark();
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(),
brightness: Brightness.dark,
theme: theme,
);
expectCheckmarkColor(find.byType(InputChip), Colors.white.withAlpha(0xde));
expectCheckmarkColor(find.byType(InputChip), theme.colorScheme.onSurface);
});
testWidgets('Input chip check mark color can be set by the chip theme', (WidgetTester tester) async {
@ -380,32 +382,35 @@ void main() {
});
testWidgets('Material3 - Input chip has correct selected color when enabled', (WidgetTester tester) async {
final ChipThemeData material3ChipDefaults = ThemeData(useMaterial3: true).chipTheme;
final ThemeData theme = ThemeData();
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(enabled: true),
useMaterial3: true,
theme: theme,
);
final RenderBox materialBox = getMaterialBox(tester);
expect(materialBox, paints..rrect(color: material3ChipDefaults.backgroundColor));
expect(materialBox, paints..rrect(color: theme.colorScheme.secondaryContainer));
});
testWidgets('Material3 - Input chip has correct selected color when disabled', (WidgetTester tester) async {
final ChipThemeData material3ChipDefaults = ThemeData(useMaterial3: true).chipTheme;
final ThemeData theme = ThemeData();
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(),
useMaterial3: true,
theme: theme,
);
final RenderBox materialBox = getMaterialBox(tester);
expect(materialBox, paints..path(color: material3ChipDefaults.disabledColor));
expect(materialBox, paints..path(color: theme.colorScheme.onSurface));
});
testWidgets('InputChip uses provided iconTheme', (WidgetTester tester) async {
final ThemeData theme = ThemeData();
Widget buildChip({ IconThemeData? iconTheme }) {
return MaterialApp(
theme: theme,
home: Material(
child: InputChip(
iconTheme: iconTheme,
@ -419,7 +424,7 @@ void main() {
// Test default icon theme.
await tester.pumpWidget(buildChip());
expect(getIconData(tester).color, ThemeData().iconTheme.color);
expect(getIconData(tester).color, theme.colorScheme.onSurfaceVariant);
// Test provided icon theme.
await tester.pumpWidget(buildChip(iconTheme: const IconThemeData(color: Color(0xff00ff00))));