From 4e7e4512b699ee7f6b40b2f0973c551c6d909f50 Mon Sep 17 00:00:00 2001 From: Qun Cheng <36861262+QuncCccccc@users.noreply.github.com> Date: Wed, 10 May 2023 17:03:09 -0700 Subject: [PATCH] Reorder `materialStateProperty` defaults (#125905) Fixes #122250. This PR is to make sure all the MaterialStateProperty defaults are able to correctly resolve different states. * When a widget is pressed, it is also hovered, so we need to put the `MaterialState.pressed` check before `MaterialState.hovered`. * When a widget is focused, the widget should still be able to be hovered, so we should check `MaterialState.hovered` before `MaterialState.focused`. * There are also cases like in _InputDecoratorDefaultsM3, the `MaterialState.disabled` should be checked before `MaterialState.error`. the order should be disabled, (error), pressed, hovered, focused. --- .../gen_defaults/lib/app_bar_template.dart | 12 - .../gen_defaults/lib/button_template.dart | 12 +- .../lib/date_picker_template.dart | 34 +-- .../lib/icon_button_template.dart | 42 ++-- .../lib/input_decorator_template.dart | 182 +++++++-------- .../lib/segmented_button_template.dart | 12 +- .../gen_defaults/lib/slider_template.dart | 6 +- dev/tools/gen_defaults/lib/tabs_template.dart | 24 +- .../lib/time_picker_template.dart | 44 ++-- .../lib/src/material/date_picker_theme.dart | 58 ++--- .../lib/src/material/elevated_button.dart | 23 +- .../lib/src/material/filled_button.dart | 29 +-- .../flutter/lib/src/material/icon_button.dart | 60 ++--- .../lib/src/material/input_decorator.dart | 110 +++++---- .../lib/src/material/outlined_button.dart | 11 +- packages/flutter/lib/src/material/radio.dart | 6 +- .../lib/src/material/segmented_button.dart | 12 +- packages/flutter/lib/src/material/slider.dart | 6 +- packages/flutter/lib/src/material/switch.dart | 6 +- packages/flutter/lib/src/material/tabs.dart | 24 +- .../flutter/lib/src/material/text_button.dart | 11 +- .../flutter/lib/src/material/time_picker.dart | 32 +-- .../lib/src/material/toggle_buttons.dart | 20 +- .../test/material/date_picker_test.dart | 35 ++- .../test/material/date_picker_theme_test.dart | 6 + .../test/material/elevated_button_test.dart | 60 +++++ .../test/material/filled_button_test.dart | 129 +++++++++++ .../test/material/icon_button_test.dart | 212 ++++++++++++++++++ .../test/material/input_decorator_test.dart | 35 +++ .../test/material/outlined_button_test.dart | 66 +++++- .../flutter/test/material/radio_test.dart | 67 +++++- .../test/material/segmented_button_test.dart | 51 +++++ .../flutter/test/material/slider_test.dart | 14 ++ .../flutter/test/material/switch_test.dart | 50 ++++- packages/flutter/test/material/tabs_test.dart | 40 +++- .../test/material/text_button_test.dart | 64 +++++- .../test/material/toggle_buttons_test.dart | 78 +++---- 37 files changed, 1234 insertions(+), 449 deletions(-) diff --git a/dev/tools/gen_defaults/lib/app_bar_template.dart b/dev/tools/gen_defaults/lib/app_bar_template.dart index ffb29a1ea2..efa22b6b35 100644 --- a/dev/tools/gen_defaults/lib/app_bar_template.dart +++ b/dev/tools/gen_defaults/lib/app_bar_template.dart @@ -78,12 +78,6 @@ class _MediumScrollUnderFlexibleConfig with _ScrollUnderFlexibleConfig { TextStyle? get expandedTextStyle => ${textStyle('md.comp.top-app-bar.medium.headline')}?.apply(color: ${color('md.comp.top-app-bar.medium.headline.color')}); - @override - EdgeInsetsGeometry? get collapsedTitlePadding => const EdgeInsetsDirectional.only(start: 40); - - @override - EdgeInsetsGeometry? get collapsedCenteredTitlePadding => const EdgeInsetsDirectional.only(start: 40); - @override EdgeInsetsGeometry? get expandedTitlePadding => const EdgeInsets.fromLTRB(16, 0, 16, 20); } @@ -107,12 +101,6 @@ class _LargeScrollUnderFlexibleConfig with _ScrollUnderFlexibleConfig { TextStyle? get expandedTextStyle => ${textStyle('md.comp.top-app-bar.large.headline')}?.apply(color: ${color('md.comp.top-app-bar.large.headline.color')}); - @override - EdgeInsetsGeometry? get collapsedTitlePadding => const EdgeInsetsDirectional.only(start: 40); - - @override - EdgeInsetsGeometry? get collapsedCenteredTitlePadding => const EdgeInsetsDirectional.only(start: 40); - @override EdgeInsetsGeometry? get expandedTitlePadding => const EdgeInsets.fromLTRB(16, 0, 16, 28); } diff --git a/dev/tools/gen_defaults/lib/button_template.dart b/dev/tools/gen_defaults/lib/button_template.dart index aab88d252e..e109bc39c9 100644 --- a/dev/tools/gen_defaults/lib/button_template.dart +++ b/dev/tools/gen_defaults/lib/button_template.dart @@ -35,15 +35,15 @@ class ButtonTemplate extends TokenTemplate { if (states.contains(MaterialState.disabled)) { return ${elevation("$tokenGroup.disabled.container")}; } + if (states.contains(MaterialState.pressed)) { + return ${elevation("$tokenGroup.pressed.container")}; + } if (states.contains(MaterialState.hovered)) { return ${elevation("$tokenGroup.hover.container")}; } if (states.contains(MaterialState.focused)) { return ${elevation("$tokenGroup.focus.container")}; } - if (states.contains(MaterialState.pressed)) { - return ${elevation("$tokenGroup.pressed.container")}; - } return ${elevation("$tokenGroup.container")}; })'''; } @@ -92,15 +92,15 @@ class _${blockName}DefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.pressed.state-layer')}; - } return null; }); diff --git a/dev/tools/gen_defaults/lib/date_picker_template.dart b/dev/tools/gen_defaults/lib/date_picker_template.dart index 6b684cfaf5..144182e95e 100644 --- a/dev/tools/gen_defaults/lib/date_picker_template.dart +++ b/dev/tools/gen_defaults/lib/date_picker_template.dart @@ -106,25 +106,25 @@ class _${blockName}DefaultsM3 extends DatePickerThemeData { MaterialStateProperty? get dayOverlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor('md.comp.date-picker.modal.date', 'selected', 'pressed')}; + } if (states.contains(MaterialState.hovered)) { return ${_stateColor('md.comp.date-picker.modal.date', 'selected', 'hover')}; } if (states.contains(MaterialState.focused)) { return ${_stateColor('md.comp.date-picker.modal.date', 'selected', 'focus')}; } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor('md.comp.date-picker.modal.date', 'selected', 'pressed')}; - } } else { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor('md.comp.date-picker.modal.date', 'unselected', 'pressed')}; + } if (states.contains(MaterialState.hovered)) { return ${_stateColor('md.comp.date-picker.modal.date', 'unselected', 'hover')}; } if (states.contains(MaterialState.focused)) { return ${_stateColor('md.comp.date-picker.modal.date', 'unselected', 'focus')}; } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor('md.comp.date-picker.modal.date', 'unselected', 'pressed')}; - } } return null; }); @@ -173,25 +173,25 @@ class _${blockName}DefaultsM3 extends DatePickerThemeData { MaterialStateProperty? get yearOverlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'selected', 'pressed')}; + } if (states.contains(MaterialState.hovered)) { return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'selected', 'hover')}; } if (states.contains(MaterialState.focused)) { return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'selected', 'focus')}; } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'selected', 'pressed')}; - } } else { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'unselected', 'pressed')}; + } if (states.contains(MaterialState.hovered)) { return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'unselected', 'hover')}; } if (states.contains(MaterialState.focused)) { return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'unselected', 'focus')}; } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor('md.comp.date-picker.modal.year-selection.year', 'unselected', 'pressed')}; - } } return null; }); @@ -208,14 +208,14 @@ class _${blockName}DefaultsM3 extends DatePickerThemeData { @override MaterialStateProperty? get rangeSelectionOverlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor('md.comp.date-picker.modal.range-selection.date.in-range', null, 'pressed')}; + } if (states.contains(MaterialState.hovered)) { - return ${_stateColor('md.comp.date-picker.modal.range-selection.date.in-range.', null, 'hover')}; + return ${_stateColor('md.comp.date-picker.modal.range-selection.date.in-range', null, 'hover')}; } if (states.contains(MaterialState.focused)) { - return ${_stateColor('md.comp.date-picker.modal.range-selection.date.in-range.', null, 'focus')}; - } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor('md.comp.date-picker.modal.range-selection.date.in-range.', null, 'pressed')}; + return ${_stateColor('md.comp.date-picker.modal.range-selection.date.in-range', null, 'focus')}; } return null; }); diff --git a/dev/tools/gen_defaults/lib/icon_button_template.dart b/dev/tools/gen_defaults/lib/icon_button_template.dart index b0cad41fe9..1455b1534f 100644 --- a/dev/tools/gen_defaults/lib/icon_button_template.dart +++ b/dev/tools/gen_defaults/lib/icon_button_template.dart @@ -95,26 +95,29 @@ class IconButtonTemplate extends TokenTemplate { MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.toggle.selected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); + } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.toggle.selected.hover.state-layer')}.withOpacity(${opacity('$tokenGroup.hover.state-layer.opacity')}); } if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.toggle.selected.focus.state-layer')}.withOpacity(${opacity('$tokenGroup.focus.state-layer.opacity')}); } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.toggle.selected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); - } } if (toggleable) { // toggleable but unselected case + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.toggle.unselected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); + } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.toggle.unselected.hover.state-layer')}.withOpacity(${opacity('$tokenGroup.hover.state-layer.opacity')}); } if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.toggle.unselected.focus.state-layer')}.withOpacity(${opacity('$tokenGroup.focus.state-layer.opacity')}); } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.toggle.unselected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); - } + } + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.pressed.state-layer')}; } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.hover.state-layer')}; @@ -122,24 +125,24 @@ class IconButtonTemplate extends TokenTemplate { if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.pressed.state-layer')}; - } return Colors.transparent; })'''; case 'md.comp.outlined-icon-button': return ''' MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.selected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); + } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.selected.hover.state-layer')}.withOpacity(${opacity('$tokenGroup.hover.state-layer.opacity')}); } if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.selected.focus.state-layer')}.withOpacity(${opacity('$tokenGroup.focus.state-layer.opacity')}); } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.selected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); - } + } + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.unselected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.unselected.hover.state-layer')}.withOpacity(${opacity('$tokenGroup.hover.state-layer.opacity')}); @@ -147,9 +150,6 @@ class IconButtonTemplate extends TokenTemplate { if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.unselected.focus.state-layer')}.withOpacity(${opacity('$tokenGroup.focus.state-layer.opacity')}); } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.unselected.pressed.state-layer')}.withOpacity(${opacity('$tokenGroup.pressed.state-layer.opacity')}); - } return Colors.transparent; })'''; case 'md.comp.icon-button': @@ -157,15 +157,18 @@ class IconButtonTemplate extends TokenTemplate { MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.selected.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.selected.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.selected.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.selected.pressed.state-layer')}; - } + } + if (states.contains(MaterialState.pressed)) { + return ${componentColor('$tokenGroup.unselected.pressed.state-layer')}; } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.unselected.hover.state-layer')}; @@ -173,9 +176,6 @@ class IconButtonTemplate extends TokenTemplate { if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.unselected.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('$tokenGroup.unselected.pressed.state-layer')}; - } return Colors.transparent; })'''; } diff --git a/dev/tools/gen_defaults/lib/input_decorator_template.dart b/dev/tools/gen_defaults/lib/input_decorator_template.dart index 8e1b213f5f..ca2db97ea5 100644 --- a/dev/tools/gen_defaults/lib/input_decorator_template.dart +++ b/dev/tools/gen_defaults/lib/input_decorator_template.dart @@ -39,119 +39,119 @@ class _${blockName}DefaultsM3 extends InputDecorationTheme { @override BorderSide? get activeIndicatorBorder => MaterialStateBorderSide.resolveWith((Set states) { - if (states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return ${mergedBorder('md.comp.filled-text-field.error.focus.active-indicator','md.comp.filled-text-field.focus.active-indicator')}; - } - if (states.contains(MaterialState.hovered)) { - return ${border('md.comp.filled-text-field.error.hover.active-indicator')}; - } - return ${border('md.comp.filled-text-field.error.active-indicator')}; + if (states.contains(MaterialState.disabled)) { + return ${border('md.comp.filled-text-field.disabled.active-indicator')}; + } + if (states.contains(MaterialState.error)) { + if (states.contains(MaterialState.hovered)) { + return ${border('md.comp.filled-text-field.error.hover.active-indicator')}; } if (states.contains(MaterialState.focused)) { - return ${border('md.comp.filled-text-field.focus.active-indicator')}; + return ${mergedBorder('md.comp.filled-text-field.error.focus.active-indicator','md.comp.filled-text-field.focus.active-indicator')}; } - if (states.contains(MaterialState.hovered)) { - return ${border('md.comp.filled-text-field.hover.active-indicator')}; - } - if (states.contains(MaterialState.disabled)) { - return ${border('md.comp.filled-text-field.disabled.active-indicator')}; - } - return ${border('md.comp.filled-text-field.active-indicator')}; + return ${border('md.comp.filled-text-field.error.active-indicator')}; + } + if (states.contains(MaterialState.hovered)) { + return ${border('md.comp.filled-text-field.hover.active-indicator')}; + } + if (states.contains(MaterialState.focused)) { + return ${border('md.comp.filled-text-field.focus.active-indicator')}; + } + return ${border('md.comp.filled-text-field.active-indicator')}; }); @override BorderSide? get outlineBorder => MaterialStateBorderSide.resolveWith((Set states) { - if (states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return ${mergedBorder('md.comp.outlined-text-field.error.focus.outline','md.comp.outlined-text-field.focus.outline')}; - } - if (states.contains(MaterialState.hovered)) { - return ${border('md.comp.outlined-text-field.error.hover.outline')}; - } - return ${border('md.comp.outlined-text-field.error.outline')}; + if (states.contains(MaterialState.disabled)) { + return ${border('md.comp.outlined-text-field.disabled.outline')}; + } + if (states.contains(MaterialState.error)) { + if (states.contains(MaterialState.hovered)) { + return ${border('md.comp.outlined-text-field.error.hover.outline')}; } if (states.contains(MaterialState.focused)) { - return ${border('md.comp.outlined-text-field.focus.outline')}; + return ${mergedBorder('md.comp.outlined-text-field.error.focus.outline','md.comp.outlined-text-field.focus.outline')}; } - if (states.contains(MaterialState.hovered)) { - return ${border('md.comp.outlined-text-field.hover.outline')}; - } - if (states.contains(MaterialState.disabled)) { - return ${border('md.comp.outlined-text-field.disabled.outline')}; - } - return ${border('md.comp.outlined-text-field.outline')}; - }); + return ${border('md.comp.outlined-text-field.error.outline')}; + } + if (states.contains(MaterialState.hovered)) { + return ${border('md.comp.outlined-text-field.hover.outline')}; + } + if (states.contains(MaterialState.focused)) { + return ${border('md.comp.outlined-text-field.focus.outline')}; + } + return ${border('md.comp.outlined-text-field.outline')}; + }); @override Color? get iconColor => ${componentColor("md.comp.filled-text-field.leading-icon")}; @override Color? get prefixIconColor => MaterialStateColor.resolveWith((Set states) {${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.focused)) { - return ${componentColor('md.comp.filled-text-field.error.focus.leading-icon')}; - } - if (states.contains(MaterialState.hovered)) { - return ${componentColor('md.comp.filled-text-field.error.hover.leading-icon')}; - } - return ${componentColor('md.comp.filled-text-field.error.leading-icon')}; - }'''}${componentColor('md.comp.filled-text-field.focus.leading-icon') == componentColor('md.comp.filled-text-field.leading-icon') ? '' : ''' - if (states.contains(MaterialState.focused)) { - return ${componentColor('md.comp.filled-text-field.focus.leading-icon')}; - }'''}${componentColor('md.comp.filled-text-field.hover.leading-icon') == componentColor('md.comp.filled-text-field.leading-icon') ? '' : ''' - if (states.contains(MaterialState.hovered)) { - return ${componentColor('md.comp.filled-text-field.hover.leading-icon')}; - }'''} if (states.contains(MaterialState.disabled)) { return ${componentColor('md.comp.filled-text-field.disabled.leading-icon')}; } + if(states.contains(MaterialState.error)) { + if (states.contains(MaterialState.hovered)) { + return ${componentColor('md.comp.filled-text-field.error.hover.leading-icon')}; + } + if (states.contains(MaterialState.focused)) { + return ${componentColor('md.comp.filled-text-field.error.focus.leading-icon')}; + } + return ${componentColor('md.comp.filled-text-field.error.leading-icon')}; + }'''}${componentColor('md.comp.filled-text-field.hover.leading-icon') == componentColor('md.comp.filled-text-field.leading-icon') ? '' : ''' + if (states.contains(MaterialState.hovered)) { + return ${componentColor('md.comp.filled-text-field.hover.leading-icon')}; + }'''}${componentColor('md.comp.filled-text-field.focus.leading-icon') == componentColor('md.comp.filled-text-field.leading-icon') ? '' : ''' + if (states.contains(MaterialState.focused)) { + return ${componentColor('md.comp.filled-text-field.focus.leading-icon')}; + }'''} return ${componentColor('md.comp.filled-text-field.leading-icon')}; }); @override Color? get suffixIconColor => MaterialStateColor.resolveWith((Set states) { - if(states.contains(MaterialState.error)) {${componentColor('md.comp.filled-text-field.error.trailing-icon') == componentColor('md.comp.filled-text-field.error.focus.trailing-icon') ? '' : ''' - if (states.contains(MaterialState.focused)) { - return ${componentColor('md.comp.filled-text-field.error.focus.trailing-icon')}; - }'''} - if (states.contains(MaterialState.hovered)) { - return ${componentColor('md.comp.filled-text-field.error.hover.trailing-icon')}; - } - return ${componentColor('md.comp.filled-text-field.error.trailing-icon')}; - }${componentColor('md.comp.filled-text-field.focus.trailing-icon') == componentColor('md.comp.filled-text-field.trailing-icon') ? '' : ''' - if (states.contains(MaterialState.focused)) { - return ${componentColor('md.comp.filled-text-field.focus.trailing-icon')}; - }'''}${componentColor('md.comp.filled-text-field.hover.trailing-icon') == componentColor('md.comp.filled-text-field.trailing-icon') ? '' : ''' - if (states.contains(MaterialState.hovered)) { - return ${componentColor('md.comp.filled-text-field.hover.trailing-icon')}; - }'''} if (states.contains(MaterialState.disabled)) { return ${componentColor('md.comp.filled-text-field.disabled.trailing-icon')}; } + if(states.contains(MaterialState.error)) {${componentColor('md.comp.filled-text-field.error.trailing-icon') == componentColor('md.comp.filled-text-field.error.focus.trailing-icon') ? '' : ''' + if (states.contains(MaterialState.hovered)) { + return ${componentColor('md.comp.filled-text-field.error.hover.trailing-icon')}; + } + if (states.contains(MaterialState.focused)) { + return ${componentColor('md.comp.filled-text-field.error.focus.trailing-icon')}; + }'''} + return ${componentColor('md.comp.filled-text-field.error.trailing-icon')}; + }${componentColor('md.comp.filled-text-field.hover.trailing-icon') == componentColor('md.comp.filled-text-field.trailing-icon') ? '' : ''' + if (states.contains(MaterialState.hovered)) { + return ${componentColor('md.comp.filled-text-field.hover.trailing-icon')}; + }'''}${componentColor('md.comp.filled-text-field.focus.trailing-icon') == componentColor('md.comp.filled-text-field.trailing-icon') ? '' : ''' + if (states.contains(MaterialState.focused)) { + return ${componentColor('md.comp.filled-text-field.focus.trailing-icon')}; + }'''} return ${componentColor('md.comp.filled-text-field.trailing-icon')}; }); @override TextStyle? get labelStyle => MaterialStateTextStyle.resolveWith((Set states) { final TextStyle textStyle = ${textStyle("md.comp.filled-text-field.label-text")} ?? const TextStyle(); + if (states.contains(MaterialState.disabled)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.disabled.label-text')}); + } if(states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.focus.label-text')}); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.hover.label-text')}); } + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.focus.label-text')}); + } return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.label-text')}); } - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.focus.label-text')}); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.hover.label-text')}); } - if (states.contains(MaterialState.disabled)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.disabled.label-text')}); + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.focus.label-text')}); } return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.label-text')}); }); @@ -159,50 +159,50 @@ class _${blockName}DefaultsM3 extends InputDecorationTheme { @override TextStyle? get floatingLabelStyle => MaterialStateTextStyle.resolveWith((Set states) { final TextStyle textStyle = ${textStyle("md.comp.filled-text-field.label-text")} ?? const TextStyle(); + if (states.contains(MaterialState.disabled)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.disabled.label-text')}); + } if(states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.focus.label-text')}); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.hover.label-text')}); } + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.focus.label-text')}); + } return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.label-text')}); } - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.focus.label-text')}); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.hover.label-text')}); } - if (states.contains(MaterialState.disabled)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.disabled.label-text')}); + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.focus.label-text')}); } return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.label-text')}); }); @override TextStyle? get helperStyle => MaterialStateTextStyle.resolveWith((Set states) { - final TextStyle textStyle = ${textStyle("md.comp.filled-text-field.supporting-text")} ?? const TextStyle();${componentColor('md.comp.filled-text-field.focus.supporting-text') == componentColor('md.comp.filled-text-field.supporting-text') ? '' : ''' - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.focus.supporting-text')}); - }'''}${componentColor('md.comp.filled-text-field.hover.supporting-text') == componentColor('md.comp.filled-text-field.supporting-text') ? '' : ''' - if (states.contains(MaterialState.hovered)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.hover.supporting-text')}); - }'''} + final TextStyle textStyle = ${textStyle("md.comp.filled-text-field.supporting-text")} ?? const TextStyle(); if (states.contains(MaterialState.disabled)) { return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.disabled.supporting-text')}); - } + }${componentColor('md.comp.filled-text-field.hover.supporting-text') == componentColor('md.comp.filled-text-field.supporting-text') ? '' : ''' + if (states.contains(MaterialState.hovered)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.hover.supporting-text')}); + }'''}${componentColor('md.comp.filled-text-field.focus.supporting-text') == componentColor('md.comp.filled-text-field.supporting-text') ? '' : ''' + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.focus.supporting-text')}); + }'''} return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.supporting-text')}); }); @override TextStyle? get errorStyle => MaterialStateTextStyle.resolveWith((Set states) { - final TextStyle textStyle = ${textStyle("md.comp.filled-text-field.supporting-text")} ?? const TextStyle();${componentColor('md.comp.filled-text-field.error.focus.supporting-text') == componentColor('md.comp.filled-text-field.error.supporting-text') ? '' : ''' - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.focus.supporting-text')}); - }'''}${componentColor('md.comp.filled-text-field.error.hover.supporting-text') == componentColor('md.comp.filled-text-field.error.supporting-text') ? '' : ''' + final TextStyle textStyle = ${textStyle("md.comp.filled-text-field.supporting-text")} ?? const TextStyle();${componentColor('md.comp.filled-text-field.error.hover.supporting-text') == componentColor('md.comp.filled-text-field.error.supporting-text') ? '' : ''' if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.hover.supporting-text')}); + }'''}${componentColor('md.comp.filled-text-field.error.focus.supporting-text') == componentColor('md.comp.filled-text-field.error.supporting-text') ? '' : ''' + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.focus.supporting-text')}); }'''} return textStyle.copyWith(color: ${componentColor('md.comp.filled-text-field.error.supporting-text')}); }); diff --git a/dev/tools/gen_defaults/lib/segmented_button_template.dart b/dev/tools/gen_defaults/lib/segmented_button_template.dart index b1ec3ede7e..c8268f2d4c 100644 --- a/dev/tools/gen_defaults/lib/segmented_button_template.dart +++ b/dev/tools/gen_defaults/lib/segmented_button_template.dart @@ -82,25 +82,25 @@ class _${blockName}DefaultsM3 extends SegmentedButtonThemeData { }), overlayColor: MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor(tokenGroup, 'selected', 'pressed')}; + } if (states.contains(MaterialState.hovered)) { return ${_stateColor(tokenGroup, 'selected', 'hover')}; } if (states.contains(MaterialState.focused)) { return ${_stateColor(tokenGroup, 'selected', 'focus')}; } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor(tokenGroup, 'selected', 'pressed')}; - } } else { + if (states.contains(MaterialState.pressed)) { + return ${_stateColor(tokenGroup, 'unselected', 'pressed')}; + } if (states.contains(MaterialState.hovered)) { return ${_stateColor(tokenGroup, 'unselected', 'hover')}; } if (states.contains(MaterialState.focused)) { return ${_stateColor(tokenGroup, 'unselected', 'focus')}; } - if (states.contains(MaterialState.pressed)) { - return ${_stateColor(tokenGroup, 'unselected', 'pressed')}; - } } return null; }), diff --git a/dev/tools/gen_defaults/lib/slider_template.dart b/dev/tools/gen_defaults/lib/slider_template.dart index ec0d6c1c0b..ca3f15bd9c 100644 --- a/dev/tools/gen_defaults/lib/slider_template.dart +++ b/dev/tools/gen_defaults/lib/slider_template.dart @@ -58,15 +58,15 @@ class _${blockName}DefaultsM3 extends SliderThemeData { @override Color? get overlayColor => MaterialStateColor.resolveWith((Set states) { + if (states.contains(MaterialState.dragged)) { + return ${componentColor('$tokenGroup.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('$tokenGroup.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('$tokenGroup.focus.state-layer')}; } - if (states.contains(MaterialState.dragged)) { - return ${componentColor('$tokenGroup.pressed.state-layer')}; - } return Colors.transparent; }); diff --git a/dev/tools/gen_defaults/lib/tabs_template.dart b/dev/tools/gen_defaults/lib/tabs_template.dart index c3c1f81977..17e5b20060 100644 --- a/dev/tools/gen_defaults/lib/tabs_template.dart +++ b/dev/tools/gen_defaults/lib/tabs_template.dart @@ -43,26 +43,26 @@ class _${blockName}PrimaryDefaultsM3 extends TabBarTheme { MaterialStateProperty get overlayColor { return MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${componentColor('md.comp.primary-navigation-tab.active.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('md.comp.primary-navigation-tab.active.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('md.comp.primary-navigation-tab.active.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('md.comp.primary-navigation-tab.active.pressed.state-layer')}; - } return null; } + if (states.contains(MaterialState.pressed)) { + return ${componentColor('md.comp.primary-navigation-tab.inactive.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('md.comp.primary-navigation-tab.inactive.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('md.comp.primary-navigation-tab.inactive.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('md.comp.primary-navigation-tab.inactive.pressed.state-layer')}; - } return null; }); } @@ -107,26 +107,26 @@ class _${blockName}SecondaryDefaultsM3 extends TabBarTheme { MaterialStateProperty get overlayColor { return MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return ${componentColor('md.comp.secondary-navigation-tab.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('md.comp.secondary-navigation-tab.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('md.comp.secondary-navigation-tab.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('md.comp.secondary-navigation-tab.pressed.state-layer')}; - } return null; } + if (states.contains(MaterialState.pressed)) { + return ${componentColor('md.comp.secondary-navigation-tab.pressed.state-layer')}; + } if (states.contains(MaterialState.hovered)) { return ${componentColor('md.comp.secondary-navigation-tab.hover.state-layer')}; } if (states.contains(MaterialState.focused)) { return ${componentColor('md.comp.secondary-navigation-tab.focus.state-layer')}; } - if (states.contains(MaterialState.pressed)) { - return ${componentColor('md.comp.secondary-navigation-tab.pressed.state-layer')}; - } return null; }); } diff --git a/dev/tools/gen_defaults/lib/time_picker_template.dart b/dev/tools/gen_defaults/lib/time_picker_template.dart index 0bf08cb02a..b1aa65ecda 100644 --- a/dev/tools/gen_defaults/lib/time_picker_template.dart +++ b/dev/tools/gen_defaults/lib/time_picker_template.dart @@ -96,12 +96,12 @@ class _${blockName}DefaultsM3 extends _TimePickerDefaults { textColor = ${componentColor("$dayPeriodComponent.selected.pressed.label-text")}; } else { // not pressed - if (states.contains(MaterialState.focused)) { - textColor = ${componentColor("$dayPeriodComponent.selected.focus.label-text")}; + if (states.contains(MaterialState.hovered)) { + textColor = ${componentColor("$dayPeriodComponent.selected.hover.label-text")}; } else { - // not focused - if (states.contains(MaterialState.hovered)) { - textColor = ${componentColor("$dayPeriodComponent.selected.hover.label-text")}; + // not hovered + if (states.contains(MaterialState.focused)) { + textColor = ${componentColor("$dayPeriodComponent.selected.focus.label-text")}; } } } @@ -111,12 +111,12 @@ class _${blockName}DefaultsM3 extends _TimePickerDefaults { textColor = ${componentColor("$dayPeriodComponent.unselected.pressed.label-text")}; } else { // not pressed - if (states.contains(MaterialState.focused)) { - textColor = ${componentColor("$dayPeriodComponent.unselected.focus.label-text")}; + if (states.contains(MaterialState.hovered)) { + textColor = ${componentColor("$dayPeriodComponent.unselected.hover.label-text")}; } else { - // not focused - if (states.contains(MaterialState.hovered)) { - textColor = ${componentColor("$dayPeriodComponent.unselected.hover.label-text")}; + // not hovered + if (states.contains(MaterialState.focused)) { + textColor = ${componentColor("$dayPeriodComponent.unselected.focus.label-text")}; } } } @@ -205,24 +205,24 @@ class _${blockName}DefaultsM3 extends _TimePickerDefaults { Color overlayColor = ${componentColor('$hourMinuteComponent.selected.container')}; if (states.contains(MaterialState.pressed)) { overlayColor = ${componentColor('$hourMinuteComponent.selected.pressed.state-layer')}; - } else if (states.contains(MaterialState.focused)) { - const double focusOpacity = ${opacity('$hourMinuteComponent.focus.state-layer.opacity')}; - overlayColor = ${componentColor('$hourMinuteComponent.selected.focus.state-layer')}.withOpacity(focusOpacity); } else if (states.contains(MaterialState.hovered)) { const double hoverOpacity = ${opacity('$hourMinuteComponent.hover.state-layer.opacity')}; overlayColor = ${componentColor('$hourMinuteComponent.selected.hover.state-layer')}.withOpacity(hoverOpacity); + } else if (states.contains(MaterialState.focused)) { + const double focusOpacity = ${opacity('$hourMinuteComponent.focus.state-layer.opacity')}; + overlayColor = ${componentColor('$hourMinuteComponent.selected.focus.state-layer')}.withOpacity(focusOpacity); } return Color.alphaBlend(overlayColor, ${componentColor('$hourMinuteComponent.selected.container')}); } else { Color overlayColor = ${componentColor('$hourMinuteComponent.unselected.container')}; if (states.contains(MaterialState.pressed)) { overlayColor = ${componentColor('$hourMinuteComponent.unselected.pressed.state-layer')}; - } else if (states.contains(MaterialState.focused)) { - const double focusOpacity = ${opacity('$hourMinuteComponent.focus.state-layer.opacity')}; - overlayColor = ${componentColor('$hourMinuteComponent.unselected.focus.state-layer')}.withOpacity(focusOpacity); } else if (states.contains(MaterialState.hovered)) { const double hoverOpacity = ${opacity('$hourMinuteComponent.hover.state-layer.opacity')}; overlayColor = ${componentColor('$hourMinuteComponent.unselected.hover.state-layer')}.withOpacity(hoverOpacity); + } else if (states.contains(MaterialState.focused)) { + const double focusOpacity = ${opacity('$hourMinuteComponent.focus.state-layer.opacity')}; + overlayColor = ${componentColor('$hourMinuteComponent.unselected.focus.state-layer')}.withOpacity(focusOpacity); } return Color.alphaBlend(overlayColor, ${componentColor('$hourMinuteComponent.unselected.container')}); } @@ -271,24 +271,24 @@ class _${blockName}DefaultsM3 extends _TimePickerDefaults { if (states.contains(MaterialState.pressed)) { return ${componentColor("$hourMinuteComponent.selected.pressed.label-text")}; } - if (states.contains(MaterialState.focused)) { - return ${componentColor("$hourMinuteComponent.selected.focus.label-text")}; - } if (states.contains(MaterialState.hovered)) { return ${componentColor("$hourMinuteComponent.selected.hover.label-text")}; } + if (states.contains(MaterialState.focused)) { + return ${componentColor("$hourMinuteComponent.selected.focus.label-text")}; + } return ${componentColor("$hourMinuteComponent.selected.label-text")}; } else { // unselected if (states.contains(MaterialState.pressed)) { return ${componentColor("$hourMinuteComponent.unselected.pressed.label-text")}; } - if (states.contains(MaterialState.focused)) { - return ${componentColor("$hourMinuteComponent.unselected.focus.label-text")}; - } if (states.contains(MaterialState.hovered)) { return ${componentColor("$hourMinuteComponent.unselected.hover.label-text")}; } + if (states.contains(MaterialState.focused)) { + return ${componentColor("$hourMinuteComponent.unselected.focus.label-text")}; + } return ${componentColor("$hourMinuteComponent.unselected.label-text")}; } }); diff --git a/packages/flutter/lib/src/material/date_picker_theme.dart b/packages/flutter/lib/src/material/date_picker_theme.dart index 7fb07203dd..6fb39976b1 100644 --- a/packages/flutter/lib/src/material/date_picker_theme.dart +++ b/packages/flutter/lib/src/material/date_picker_theme.dart @@ -675,25 +675,25 @@ class _DatePickerDefaultsM2 extends DatePickerThemeData { MaterialStateProperty? get dayOverlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.38); + } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.38); - } } else { + if (states.contains(MaterialState.pressed)) { + return _colors.onSurfaceVariant.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurfaceVariant.withOpacity(0.12); - } } return null; }); @@ -746,25 +746,25 @@ class _DatePickerDefaultsM2 extends DatePickerThemeData { MaterialStateProperty? get rangeSelectionOverlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.38); + } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.38); - } } else { + if (states.contains(MaterialState.pressed)) { + return _colors.onSurfaceVariant.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurfaceVariant.withOpacity(0.12); - } } return null; }); @@ -846,25 +846,25 @@ class _DatePickerDefaultsM3 extends DatePickerThemeData { MaterialStateProperty? get dayOverlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.12); - } } else { + if (states.contains(MaterialState.pressed)) { + return _colors.onSurfaceVariant.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurfaceVariant.withOpacity(0.12); - } } return null; }); @@ -913,25 +913,25 @@ class _DatePickerDefaultsM3 extends DatePickerThemeData { MaterialStateProperty? get yearOverlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.12); - } } else { + if (states.contains(MaterialState.pressed)) { + return _colors.onSurfaceVariant.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurfaceVariant.withOpacity(0.12); - } } return null; }); @@ -948,14 +948,14 @@ class _DatePickerDefaultsM3 extends DatePickerThemeData { @override MaterialStateProperty? get rangeSelectionOverlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimaryContainer.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { - return null; + return _colors.onPrimaryContainer.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { - return null; - } - if (states.contains(MaterialState.pressed)) { - return null; + return _colors.onPrimaryContainer.withOpacity(0.12); } return null; }); diff --git a/packages/flutter/lib/src/material/elevated_button.dart b/packages/flutter/lib/src/material/elevated_button.dart index 3bae641335..8d8af37419 100644 --- a/packages/flutter/lib/src/material/elevated_button.dart +++ b/packages/flutter/lib/src/material/elevated_button.dart @@ -426,10 +426,13 @@ class _ElevatedButtonDefaultOverlay extends MaterialStateProperty with D @override Color? resolve(Set states) { + if (states.contains(MaterialState.pressed)) { + return overlay.withOpacity(0.24); + } if (states.contains(MaterialState.hovered)) { return overlay.withOpacity(0.08); } - if (states.contains(MaterialState.focused) || states.contains(MaterialState.pressed)) { + if (states.contains(MaterialState.focused)) { return overlay.withOpacity(0.24); } return null; @@ -447,15 +450,15 @@ class _ElevatedButtonDefaultElevation extends MaterialStateProperty with if (states.contains(MaterialState.disabled)) { return 0; } + if (states.contains(MaterialState.pressed)) { + return elevation + 6; + } if (states.contains(MaterialState.hovered)) { return elevation + 2; } if (states.contains(MaterialState.focused)) { return elevation + 2; } - if (states.contains(MaterialState.pressed)) { - return elevation + 6; - } return elevation; } } @@ -578,15 +581,15 @@ class _ElevatedButtonDefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } return null; }); @@ -604,15 +607,15 @@ class _ElevatedButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.disabled)) { return 0.0; } + if (states.contains(MaterialState.pressed)) { + return 1.0; + } if (states.contains(MaterialState.hovered)) { return 3.0; } if (states.contains(MaterialState.focused)) { return 1.0; } - if (states.contains(MaterialState.pressed)) { - return 1.0; - } return 1.0; }); diff --git a/packages/flutter/lib/src/material/filled_button.dart b/packages/flutter/lib/src/material/filled_button.dart index f4b92e28e9..7276597c85 100644 --- a/packages/flutter/lib/src/material/filled_button.dart +++ b/packages/flutter/lib/src/material/filled_button.dart @@ -439,10 +439,13 @@ class _FilledButtonDefaultOverlay extends MaterialStateProperty with Dia @override Color? resolve(Set states) { + if (states.contains(MaterialState.pressed)) { + return overlay.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return overlay.withOpacity(0.08); } - if (states.contains(MaterialState.focused) || states.contains(MaterialState.pressed)) { + if (states.contains(MaterialState.focused)) { return overlay.withOpacity(0.12); } return null; @@ -588,15 +591,15 @@ class _FilledButtonDefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.12); - } return null; }); @@ -614,15 +617,15 @@ class _FilledButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.disabled)) { return 0.0; } + if (states.contains(MaterialState.pressed)) { + return 0.0; + } if (states.contains(MaterialState.hovered)) { return 1.0; } if (states.contains(MaterialState.focused)) { return 0.0; } - if (states.contains(MaterialState.pressed)) { - return 0.0; - } return 0.0; }); @@ -712,15 +715,15 @@ class _FilledTonalButtonDefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return _colors.onSecondaryContainer.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSecondaryContainer.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSecondaryContainer.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSecondaryContainer.withOpacity(0.12); - } return null; }); @@ -738,15 +741,15 @@ class _FilledTonalButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.disabled)) { return 0.0; } + if (states.contains(MaterialState.pressed)) { + return 0.0; + } if (states.contains(MaterialState.hovered)) { return 1.0; } if (states.contains(MaterialState.focused)) { return 0.0; } - if (states.contains(MaterialState.pressed)) { - return 0.0; - } return 0.0; }); diff --git a/packages/flutter/lib/src/material/icon_button.dart b/packages/flutter/lib/src/material/icon_button.dart index 569a40e647..7acd757622 100644 --- a/packages/flutter/lib/src/material/icon_button.dart +++ b/packages/flutter/lib/src/material/icon_button.dart @@ -1117,15 +1117,18 @@ class _IconButtonDefaultsM3 extends ButtonStyle { MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } + } + if (states.contains(MaterialState.pressed)) { + return _colors.onSurfaceVariant.withOpacity(0.12); } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); @@ -1133,9 +1136,6 @@ class _IconButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurfaceVariant.withOpacity(0.12); - } return Colors.transparent; }); @@ -1254,26 +1254,29 @@ class _FilledIconButtonDefaultsM3 extends ButtonStyle { MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.12); - } } if (toggleable) { // toggleable but unselected case + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } + } + if (states.contains(MaterialState.pressed)) { + return _colors.onPrimary.withOpacity(0.12); } if (states.contains(MaterialState.hovered)) { return _colors.onPrimary.withOpacity(0.08); @@ -1281,9 +1284,6 @@ class _FilledIconButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.focused)) { return _colors.onPrimary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onPrimary.withOpacity(0.12); - } return Colors.transparent; }); @@ -1402,26 +1402,29 @@ class _FilledTonalIconButtonDefaultsM3 extends ButtonStyle { MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onSecondaryContainer.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSecondaryContainer.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSecondaryContainer.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSecondaryContainer.withOpacity(0.12); - } } if (toggleable) { // toggleable but unselected case + if (states.contains(MaterialState.pressed)) { + return _colors.onSurfaceVariant.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurfaceVariant.withOpacity(0.12); - } + } + if (states.contains(MaterialState.pressed)) { + return _colors.onSecondaryContainer.withOpacity(0.12); } if (states.contains(MaterialState.hovered)) { return _colors.onSecondaryContainer.withOpacity(0.08); @@ -1429,9 +1432,6 @@ class _FilledTonalIconButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.focused)) { return _colors.onSecondaryContainer.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSecondaryContainer.withOpacity(0.12); - } return Colors.transparent; }); @@ -1546,15 +1546,18 @@ class _OutlinedIconButtonDefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onInverseSurface.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onInverseSurface.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onInverseSurface.withOpacity(0.08); } - if (states.contains(MaterialState.pressed)) { - return _colors.onInverseSurface.withOpacity(0.12); - } + } + if (states.contains(MaterialState.pressed)) { + return _colors.onSurface.withOpacity(0.12); } if (states.contains(MaterialState.hovered)) { return _colors.onSurfaceVariant.withOpacity(0.08); @@ -1562,9 +1565,6 @@ class _OutlinedIconButtonDefaultsM3 extends ButtonStyle { if (states.contains(MaterialState.focused)) { return _colors.onSurfaceVariant.withOpacity(0.08); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurface.withOpacity(0.12); - } return Colors.transparent; }); diff --git a/packages/flutter/lib/src/material/input_decorator.dart b/packages/flutter/lib/src/material/input_decorator.dart index 418d3732c6..28d27426e7 100644 --- a/packages/flutter/lib/src/material/input_decorator.dart +++ b/packages/flutter/lib/src/material/input_decorator.dart @@ -4560,95 +4560,89 @@ class _InputDecoratorDefaultsM3 extends InputDecorationTheme { @override BorderSide? get activeIndicatorBorder => MaterialStateBorderSide.resolveWith((Set states) { - if (states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return BorderSide(color: _colors.error, width: 2.0); - } - if (states.contains(MaterialState.hovered)) { - return BorderSide(color: _colors.onErrorContainer); - } - return BorderSide(color: _colors.error); + if (states.contains(MaterialState.disabled)) { + return BorderSide(color: _colors.onSurface.withOpacity(0.38)); + } + if (states.contains(MaterialState.error)) { + if (states.contains(MaterialState.hovered)) { + return BorderSide(color: _colors.onErrorContainer); } if (states.contains(MaterialState.focused)) { - return BorderSide(color: _colors.primary, width: 2.0); + return BorderSide(color: _colors.error, width: 2.0); } - if (states.contains(MaterialState.hovered)) { - return BorderSide(color: _colors.onSurface); - } - if (states.contains(MaterialState.disabled)) { - return BorderSide(color: _colors.onSurface.withOpacity(0.38)); - } - return BorderSide(color: _colors.onSurfaceVariant); + return BorderSide(color: _colors.error); + } + if (states.contains(MaterialState.hovered)) { + return BorderSide(color: _colors.onSurface); + } + if (states.contains(MaterialState.focused)) { + return BorderSide(color: _colors.primary, width: 2.0); + } + return BorderSide(color: _colors.onSurfaceVariant); }); @override BorderSide? get outlineBorder => MaterialStateBorderSide.resolveWith((Set states) { - if (states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return BorderSide(color: _colors.error, width: 2.0); - } - if (states.contains(MaterialState.hovered)) { - return BorderSide(color: _colors.onErrorContainer); - } - return BorderSide(color: _colors.error); + if (states.contains(MaterialState.disabled)) { + return BorderSide(color: _colors.onSurface.withOpacity(0.12)); + } + if (states.contains(MaterialState.error)) { + if (states.contains(MaterialState.hovered)) { + return BorderSide(color: _colors.onErrorContainer); } if (states.contains(MaterialState.focused)) { - return BorderSide(color: _colors.primary, width: 2.0); + return BorderSide(color: _colors.error, width: 2.0); } - if (states.contains(MaterialState.hovered)) { - return BorderSide(color: _colors.onSurface); - } - if (states.contains(MaterialState.disabled)) { - return BorderSide(color: _colors.onSurface.withOpacity(0.12)); - } - return BorderSide(color: _colors.outline); - }); + return BorderSide(color: _colors.error); + } + if (states.contains(MaterialState.hovered)) { + return BorderSide(color: _colors.onSurface); + } + if (states.contains(MaterialState.focused)) { + return BorderSide(color: _colors.primary, width: 2.0); + } + return BorderSide(color: _colors.outline); + }); @override Color? get iconColor => _colors.onSurfaceVariant; @override Color? get prefixIconColor => MaterialStateColor.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { - return _colors.onSurface.withOpacity(0.38); - } return _colors.onSurfaceVariant; }); @override Color? get suffixIconColor => MaterialStateColor.resolveWith((Set states) { - if(states.contains(MaterialState.error)) { - if (states.contains(MaterialState.hovered)) { - return _colors.onErrorContainer; - } - return _colors.error; - } if (states.contains(MaterialState.disabled)) { return _colors.onSurface.withOpacity(0.38); } + if(states.contains(MaterialState.error)) { + return _colors.error; + } return _colors.onSurfaceVariant; }); @override TextStyle? get labelStyle => MaterialStateTextStyle.resolveWith((Set states) { final TextStyle textStyle = _textTheme.bodyLarge ?? const TextStyle(); + if (states.contains(MaterialState.disabled)) { + return textStyle.copyWith(color: _colors.onSurface.withOpacity(0.38)); + } if(states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: _colors.error); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: _colors.onErrorContainer); } + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: _colors.error); + } return textStyle.copyWith(color: _colors.error); } - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: _colors.primary); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: _colors.onSurfaceVariant); } - if (states.contains(MaterialState.disabled)) { - return textStyle.copyWith(color: _colors.onSurface.withOpacity(0.38)); + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: _colors.primary); } return textStyle.copyWith(color: _colors.onSurfaceVariant); }); @@ -4656,23 +4650,23 @@ class _InputDecoratorDefaultsM3 extends InputDecorationTheme { @override TextStyle? get floatingLabelStyle => MaterialStateTextStyle.resolveWith((Set states) { final TextStyle textStyle = _textTheme.bodyLarge ?? const TextStyle(); + if (states.contains(MaterialState.disabled)) { + return textStyle.copyWith(color: _colors.onSurface.withOpacity(0.38)); + } if(states.contains(MaterialState.error)) { - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: _colors.error); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: _colors.onErrorContainer); } + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: _colors.error); + } return textStyle.copyWith(color: _colors.error); } - if (states.contains(MaterialState.focused)) { - return textStyle.copyWith(color: _colors.primary); - } if (states.contains(MaterialState.hovered)) { return textStyle.copyWith(color: _colors.onSurfaceVariant); } - if (states.contains(MaterialState.disabled)) { - return textStyle.copyWith(color: _colors.onSurface.withOpacity(0.38)); + if (states.contains(MaterialState.focused)) { + return textStyle.copyWith(color: _colors.primary); } return textStyle.copyWith(color: _colors.onSurfaceVariant); }); diff --git a/packages/flutter/lib/src/material/outlined_button.dart b/packages/flutter/lib/src/material/outlined_button.dart index 77e67322ef..59739ef6f5 100644 --- a/packages/flutter/lib/src/material/outlined_button.dart +++ b/packages/flutter/lib/src/material/outlined_button.dart @@ -382,10 +382,13 @@ class _OutlinedButtonDefaultOverlay extends MaterialStateProperty with D @override Color? resolve(Set states) { + if (states.contains(MaterialState.pressed)) { + return foreground.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return foreground.withOpacity(0.04); } - if (states.contains(MaterialState.focused) || states.contains(MaterialState.pressed)) { + if (states.contains(MaterialState.focused)) { return foreground.withOpacity(0.12); } return null; @@ -504,15 +507,15 @@ class _OutlinedButtonDefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } return null; }); diff --git a/packages/flutter/lib/src/material/radio.dart b/packages/flutter/lib/src/material/radio.dart index 0978000f2c..ae007a7d40 100644 --- a/packages/flutter/lib/src/material/radio.dart +++ b/packages/flutter/lib/src/material/radio.dart @@ -591,12 +591,12 @@ class _RadioDefaultsM2 extends RadioThemeData { if (states.contains(MaterialState.pressed)) { return fillColor.resolve(states).withAlpha(kRadialReactionAlpha); } - if (states.contains(MaterialState.focused)) { - return _theme.focusColor; - } if (states.contains(MaterialState.hovered)) { return _theme.hoverColor; } + if (states.contains(MaterialState.focused)) { + return _theme.focusColor; + } return Colors.transparent; }); } diff --git a/packages/flutter/lib/src/material/segmented_button.dart b/packages/flutter/lib/src/material/segmented_button.dart index 253de94846..af6bdfb214 100644 --- a/packages/flutter/lib/src/material/segmented_button.dart +++ b/packages/flutter/lib/src/material/segmented_button.dart @@ -763,25 +763,25 @@ class _SegmentedButtonDefaultsM3 extends SegmentedButtonThemeData { }), overlayColor: MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onSecondaryContainer.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSecondaryContainer.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSecondaryContainer.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSecondaryContainer.withOpacity(0.12); - } } else { + if (states.contains(MaterialState.pressed)) { + return _colors.onSurface.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurface.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurface.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurface.withOpacity(0.12); - } } return null; }), diff --git a/packages/flutter/lib/src/material/slider.dart b/packages/flutter/lib/src/material/slider.dart index 0de2e30264..7f5bcaa1be 100644 --- a/packages/flutter/lib/src/material/slider.dart +++ b/packages/flutter/lib/src/material/slider.dart @@ -2005,15 +2005,15 @@ class _SliderDefaultsM3 extends SliderThemeData { @override Color? get overlayColor => MaterialStateColor.resolveWith((Set states) { + if (states.contains(MaterialState.dragged)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.dragged)) { - return _colors.primary.withOpacity(0.12); - } return Colors.transparent; }); diff --git a/packages/flutter/lib/src/material/switch.dart b/packages/flutter/lib/src/material/switch.dart index 9d5d662451..2e0e914d03 100644 --- a/packages/flutter/lib/src/material/switch.dart +++ b/packages/flutter/lib/src/material/switch.dart @@ -1736,12 +1736,12 @@ class _SwitchDefaultsM2 extends SwitchThemeData { if (states.contains(MaterialState.pressed)) { return thumbColor.resolve(states).withAlpha(kRadialReactionAlpha); } - if (states.contains(MaterialState.focused)) { - return _theme.focusColor; - } if (states.contains(MaterialState.hovered)) { return _theme.hoverColor; } + if (states.contains(MaterialState.focused)) { + return _theme.focusColor; + } return null; }); } diff --git a/packages/flutter/lib/src/material/tabs.dart b/packages/flutter/lib/src/material/tabs.dart index c0f1c68770..9686d1cda0 100644 --- a/packages/flutter/lib/src/material/tabs.dart +++ b/packages/flutter/lib/src/material/tabs.dart @@ -2194,26 +2194,26 @@ class _TabsPrimaryDefaultsM3 extends TabBarTheme { MaterialStateProperty get overlayColor { return MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } return null; } + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurface.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurface.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } return null; }); } @@ -2258,26 +2258,26 @@ class _TabsSecondaryDefaultsM3 extends TabBarTheme { MaterialStateProperty get overlayColor { return MaterialStateProperty.resolveWith((Set states) { if (states.contains(MaterialState.selected)) { + if (states.contains(MaterialState.pressed)) { + return _colors.onSurface.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurface.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurface.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurface.withOpacity(0.12); - } return null; } + if (states.contains(MaterialState.pressed)) { + return _colors.onSurface.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.onSurface.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.onSurface.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.onSurface.withOpacity(0.12); - } return null; }); } diff --git a/packages/flutter/lib/src/material/text_button.dart b/packages/flutter/lib/src/material/text_button.dart index 2ea151b1ec..97b89254da 100644 --- a/packages/flutter/lib/src/material/text_button.dart +++ b/packages/flutter/lib/src/material/text_button.dart @@ -417,10 +417,13 @@ class _TextButtonDefaultOverlay extends MaterialStateProperty { @override Color? resolve(Set states) { + if (states.contains(MaterialState.pressed)) { + return primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return primary.withOpacity(0.04); } - if (states.contains(MaterialState.focused) || states.contains(MaterialState.pressed)) { + if (states.contains(MaterialState.focused)) { return primary.withOpacity(0.12); } return null; @@ -564,15 +567,15 @@ class _TextButtonDefaultsM3 extends ButtonStyle { @override MaterialStateProperty? get overlayColor => MaterialStateProperty.resolveWith((Set states) { + if (states.contains(MaterialState.pressed)) { + return _colors.primary.withOpacity(0.12); + } if (states.contains(MaterialState.hovered)) { return _colors.primary.withOpacity(0.08); } if (states.contains(MaterialState.focused)) { return _colors.primary.withOpacity(0.12); } - if (states.contains(MaterialState.pressed)) { - return _colors.primary.withOpacity(0.12); - } return null; }); diff --git a/packages/flutter/lib/src/material/time_picker.dart b/packages/flutter/lib/src/material/time_picker.dart index 66cc9acba9..d487a9a72b 100644 --- a/packages/flutter/lib/src/material/time_picker.dart +++ b/packages/flutter/lib/src/material/time_picker.dart @@ -3402,11 +3402,11 @@ class _TimePickerDefaultsM3 extends _TimePickerDefaults { textColor = _colors.onTertiaryContainer; } else { // not pressed - if (states.contains(MaterialState.focused)) { + if (states.contains(MaterialState.hovered)) { textColor = _colors.onTertiaryContainer; } else { - // not focused - if (states.contains(MaterialState.hovered)) { + // not hovered + if (states.contains(MaterialState.focused)) { textColor = _colors.onTertiaryContainer; } } @@ -3417,11 +3417,11 @@ class _TimePickerDefaultsM3 extends _TimePickerDefaults { textColor = _colors.onSurfaceVariant; } else { // not pressed - if (states.contains(MaterialState.focused)) { + if (states.contains(MaterialState.hovered)) { textColor = _colors.onSurfaceVariant; } else { - // not focused - if (states.contains(MaterialState.hovered)) { + // not hovered + if (states.contains(MaterialState.focused)) { textColor = _colors.onSurfaceVariant; } } @@ -3511,24 +3511,24 @@ class _TimePickerDefaultsM3 extends _TimePickerDefaults { Color overlayColor = _colors.primaryContainer; if (states.contains(MaterialState.pressed)) { overlayColor = _colors.onPrimaryContainer; - } else if (states.contains(MaterialState.focused)) { - const double focusOpacity = 0.12; - overlayColor = _colors.onPrimaryContainer.withOpacity(focusOpacity); } else if (states.contains(MaterialState.hovered)) { const double hoverOpacity = 0.08; overlayColor = _colors.onPrimaryContainer.withOpacity(hoverOpacity); + } else if (states.contains(MaterialState.focused)) { + const double focusOpacity = 0.12; + overlayColor = _colors.onPrimaryContainer.withOpacity(focusOpacity); } return Color.alphaBlend(overlayColor, _colors.primaryContainer); } else { Color overlayColor = _colors.surfaceVariant; if (states.contains(MaterialState.pressed)) { overlayColor = _colors.onSurface; - } else if (states.contains(MaterialState.focused)) { - const double focusOpacity = 0.12; - overlayColor = _colors.onSurface.withOpacity(focusOpacity); } else if (states.contains(MaterialState.hovered)) { const double hoverOpacity = 0.08; overlayColor = _colors.onSurface.withOpacity(hoverOpacity); + } else if (states.contains(MaterialState.focused)) { + const double focusOpacity = 0.12; + overlayColor = _colors.onSurface.withOpacity(focusOpacity); } return Color.alphaBlend(overlayColor, _colors.surfaceVariant); } @@ -3577,10 +3577,10 @@ class _TimePickerDefaultsM3 extends _TimePickerDefaults { if (states.contains(MaterialState.pressed)) { return _colors.onPrimaryContainer; } - if (states.contains(MaterialState.focused)) { + if (states.contains(MaterialState.hovered)) { return _colors.onPrimaryContainer; } - if (states.contains(MaterialState.hovered)) { + if (states.contains(MaterialState.focused)) { return _colors.onPrimaryContainer; } return _colors.onPrimaryContainer; @@ -3589,10 +3589,10 @@ class _TimePickerDefaultsM3 extends _TimePickerDefaults { if (states.contains(MaterialState.pressed)) { return _colors.onSurface; } - if (states.contains(MaterialState.focused)) { + if (states.contains(MaterialState.hovered)) { return _colors.onSurface; } - if (states.contains(MaterialState.hovered)) { + if (states.contains(MaterialState.focused)) { return _colors.onSurface; } return _colors.onSurface; diff --git a/packages/flutter/lib/src/material/toggle_buttons.dart b/packages/flutter/lib/src/material/toggle_buttons.dart index 43603f2515..526156841b 100644 --- a/packages/flutter/lib/src/material/toggle_buttons.dart +++ b/packages/flutter/lib/src/material/toggle_buttons.dart @@ -892,20 +892,24 @@ class _ToggleButtonDefaultOverlay extends MaterialStateProperty { @override Color? resolve(Set states) { if (selected) { - if (states.contains(MaterialState.hovered)) { - return hoverColor ?? colorScheme?.primary.withOpacity(0.04); - } else if (states.contains(MaterialState.focused)) { - return focusColor ?? colorScheme?.primary.withOpacity(0.12); - } else if (states.contains(MaterialState.pressed)) { + if (states.contains(MaterialState.pressed)) { return splashColor ?? colorScheme?.primary.withOpacity(0.16); } + if (states.contains(MaterialState.hovered)) { + return hoverColor ?? colorScheme?.primary.withOpacity(0.04); + } + if (states.contains(MaterialState.focused)) { + return focusColor ?? colorScheme?.primary.withOpacity(0.12); + } } else if (unselected) { + if (states.contains(MaterialState.pressed)) { + return splashColor ?? highlightColor ?? colorScheme?.onSurface.withOpacity(0.16); + } if (states.contains(MaterialState.hovered)) { return hoverColor ?? colorScheme?.onSurface.withOpacity(0.04); - } else if (states.contains(MaterialState.focused)) { + } + if (states.contains(MaterialState.focused)) { return focusColor ?? colorScheme?.onSurface.withOpacity(0.12); - } else if (states.contains(MaterialState.pressed)) { - return splashColor ?? highlightColor ?? colorScheme?.onSurface.withOpacity(0.16); } } return null; diff --git a/packages/flutter/test/material/date_picker_test.dart b/packages/flutter/test/material/date_picker_test.dart index 6b8163c267..0ff9a5e607 100644 --- a/packages/flutter/test/material/date_picker_test.dart +++ b/packages/flutter/test/material/date_picker_test.dart @@ -65,10 +65,11 @@ void main() { Future Function(Future date) callback, { TextDirection textDirection = TextDirection.ltr, bool useMaterial3 = false, + ThemeData? theme, }) async { late BuildContext buttonContext; await tester.pumpWidget(MaterialApp( - theme: ThemeData(useMaterial3: useMaterial3), + theme: theme ?? ThemeData(useMaterial3: useMaterial3), home: Material( child: Builder( builder: (BuildContext context) { @@ -786,6 +787,38 @@ void main() { }); }); + testWidgets('Date picker dayOverlayColor resolves pressed state', (WidgetTester tester) async { + today = DateTime(2023, 5, 4); + final ThemeData theme = ThemeData(); + final bool material3 = theme.useMaterial3; + await prepareDatePicker(tester, (Future date) async { + await tester.pump(); + + // Hovered. + final Offset center = tester.getCenter(find.text('30')); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect( + Material.of(tester.element(find.text('30'))), + paints..circle(color: material3 ? theme.colorScheme.onSurfaceVariant.withOpacity(0.08) : theme.colorScheme.onSurfaceVariant.withOpacity(0.08)), + ); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect( + Material.of(tester.element(find.text('30'))), + paints..circle()..circle(color: material3 ? theme.colorScheme.onSurfaceVariant.withOpacity(0.12) : theme.colorScheme.onSurfaceVariant.withOpacity(0.12)) + ); + await gesture.up(); + await tester.pumpAndSettle(); + }, theme: theme); + }); + testWidgets('Selecting date does not switch picker to year selection', (WidgetTester tester) async { initialDate = DateTime(2020, DateTime.may, 10); initialCalendarMode = DatePickerMode.year; diff --git a/packages/flutter/test/material/date_picker_theme_test.dart b/packages/flutter/test/material/date_picker_theme_test.dart index 9cc1cf7848..6d3c663e9a 100644 --- a/packages/flutter/test/material/date_picker_theme_test.dart +++ b/packages/flutter/test/material/date_picker_theme_test.dart @@ -159,6 +159,10 @@ void main() { expect(m3.dayOverlayColor?.resolve({MaterialState.hovered}), colorScheme.onSurfaceVariant.withOpacity(0.08)); expect(m3.dayOverlayColor?.resolve({MaterialState.focused}), colorScheme.onSurfaceVariant.withOpacity(0.12)); expect(m3.dayOverlayColor?.resolve({MaterialState.pressed}), colorScheme.onSurfaceVariant.withOpacity(0.12)); + expect(m3.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.hovered, MaterialState.focused}), colorScheme.onPrimary.withOpacity(0.08)); + expect(m3.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.hovered, MaterialState.pressed}), colorScheme.onPrimary.withOpacity(0.12)); + expect(m3.dayOverlayColor?.resolve({MaterialState.hovered, MaterialState.focused}), colorScheme.onSurfaceVariant.withOpacity(0.08)); + expect(m3.dayOverlayColor?.resolve({MaterialState.hovered, MaterialState.pressed}), colorScheme.onSurfaceVariant.withOpacity(0.12)); expect(m3.todayForegroundColor?.resolve({}), colorScheme.primary); expect(m3.todayForegroundColor?.resolve({MaterialState.disabled}), colorScheme.primary.withOpacity(0.38)); expect(m3.todayBorder, BorderSide(color: colorScheme.primary)); @@ -224,6 +228,8 @@ void main() { expect(m2.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.hovered}), colorScheme.onPrimary.withOpacity(0.08)); expect(m2.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.focused}), colorScheme.onPrimary.withOpacity(0.12)); expect(m2.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.pressed}), colorScheme.onPrimary.withOpacity(0.38)); + expect(m2.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.hovered, MaterialState.focused}), colorScheme.onPrimary.withOpacity(0.08)); + expect(m2.dayOverlayColor?.resolve({MaterialState.selected, MaterialState.hovered, MaterialState.pressed}), colorScheme.onPrimary.withOpacity(0.38)); expect(m2.dayOverlayColor?.resolve({MaterialState.hovered}), colorScheme.onSurfaceVariant.withOpacity(0.08)); expect(m2.dayOverlayColor?.resolve({MaterialState.focused}), colorScheme.onSurfaceVariant.withOpacity(0.12)); expect(m2.dayOverlayColor?.resolve({MaterialState.pressed}), colorScheme.onSurfaceVariant.withOpacity(0.12)); diff --git a/packages/flutter/test/material/elevated_button_test.dart b/packages/flutter/test/material/elevated_button_test.dart index 434045b8e8..9bfe47ed93 100644 --- a/packages/flutter/test/material/elevated_button_test.dart +++ b/packages/flutter/test/material/elevated_button_test.dart @@ -200,6 +200,66 @@ void main() { skip: isBrowser, // https://github.com/flutter/flutter/issues/44115 ); + testWidgets('ElevatedButton default overlayColor and elevation resolve pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: ElevatedButton( + onPressed: () {}, + focusNode: focusNode, + child: const Text('ElevatedButton'), + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + double elevation() { + return tester.widget( + find.descendant( + of: find.byType(ElevatedButton), + matching: find.byType(PhysicalShape), + ), + ).elevation; + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(ElevatedButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(elevation(), 3.0); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(elevation(), 1.0); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(elevation(), 1.0); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + }); testWidgets('ElevatedButton uses stateful color for text color in different states', (WidgetTester tester) async { final FocusNode focusNode = FocusNode(); diff --git a/packages/flutter/test/material/filled_button_test.dart b/packages/flutter/test/material/filled_button_test.dart index 4bcffd1205..0c7b904dc7 100644 --- a/packages/flutter/test/material/filled_button_test.dart +++ b/packages/flutter/test/material/filled_button_test.dart @@ -277,6 +277,135 @@ void main() { skip: isBrowser, // https://github.com/flutter/flutter/issues/44115 ); + testWidgets('FilledButton default overlayColor and elevation resolve pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return FilledButton( + onPressed: () {}, + focusNode: focusNode, + child: const Text('FilledButton'), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + double elevation() { + return tester.widget( + find.descendant( + of: find.byType(FilledButton), + matching: find.byType(PhysicalShape), + ), + ).elevation; + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(FilledButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(elevation(), 1.0); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onPrimary.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(elevation(), 0.0); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onPrimary.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(elevation(), 0.0); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onPrimary.withOpacity(0.12))); + }); + + testWidgets('FilledButton.tonal default overlayColor and elevation resolve pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return FilledButton.tonal( + onPressed: () {}, + focusNode: focusNode, + child: const Text('FilledButton'), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + double elevation() { + return tester.widget( + find.descendant( + of: find.byType(FilledButton), + matching: find.byType(PhysicalShape), + ), + ).elevation; + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(FilledButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(elevation(), 1.0); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSecondaryContainer.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(elevation(), 0.0); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSecondaryContainer.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(elevation(), 0.0); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSecondaryContainer.withOpacity(0.12))); + }); testWidgets('FilledButton uses stateful color for text color in different states', (WidgetTester tester) async { final FocusNode focusNode = FocusNode(); diff --git a/packages/flutter/test/material/icon_button_test.dart b/packages/flutter/test/material/icon_button_test.dart index 9463ee326a..3ff46df1e7 100644 --- a/packages/flutter/test/material/icon_button_test.dart +++ b/packages/flutter/test/material/icon_button_test.dart @@ -1133,6 +1133,59 @@ void main() { expect(material.type, MaterialType.button); }); + testWidgets('IconButton default overlayColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return IconButton( + onPressed: () {}, + focusNode: focusNode, + icon: const Icon(Icons.add), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(IconButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurfaceVariant.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSurfaceVariant.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurfaceVariant.withOpacity(0.12))); + }); + testWidgets('IconButton.fill defaults - M3', (WidgetTester tester) async { final ThemeData themeM3 = ThemeData.from(colorScheme: colorScheme, useMaterial3: true); @@ -1219,6 +1272,59 @@ void main() { expect(iconColor(), colorScheme.onSurface.withOpacity(0.38)); }); + testWidgets('IconButton.fill default overlayColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return IconButton.filled( + onPressed: () {}, + focusNode: focusNode, + icon: const Icon(Icons.add), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(IconButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onPrimary.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onPrimary.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onPrimary.withOpacity(0.12))); + }); + testWidgets('Toggleable IconButton.fill defaults - M3', (WidgetTester tester) async { final ThemeData themeM3 = ThemeData.from(colorScheme: colorScheme, useMaterial3: true); @@ -1420,6 +1526,59 @@ void main() { expect(iconColor(), colorScheme.onSurface.withOpacity(0.38)); }); + testWidgets('IconButton.filledTonal default overlayColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return IconButton.filledTonal( + onPressed: () {}, + focusNode: focusNode, + icon: const Icon(Icons.add), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(IconButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSecondaryContainer.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSecondaryContainer.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSecondaryContainer.withOpacity(0.12))); + }); + testWidgets('Toggleable IconButton.filledTonal defaults - M3', (WidgetTester tester) async { final ThemeData themeM3 = ThemeData.from(colorScheme: colorScheme, useMaterial3: true); @@ -1621,6 +1780,59 @@ void main() { expect(iconColor(), colorScheme.onSurface.withOpacity(0.38)); }); + testWidgets('IconButton.outlined default overlayColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return IconButton.outlined( + onPressed: () {}, + focusNode: focusNode, + icon: const Icon(Icons.add), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(IconButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurfaceVariant.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSurface.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurfaceVariant.withOpacity(0.08))); + }); + testWidgets('Toggleable IconButton.outlined defaults - M3', (WidgetTester tester) async { final ThemeData themeM3 = ThemeData.from(colorScheme: colorScheme, useMaterial3: true); diff --git a/packages/flutter/test/material/input_decorator_test.dart b/packages/flutter/test/material/input_decorator_test.dart index 00d85ad56f..2a3a30caeb 100644 --- a/packages/flutter/test/material/input_decorator_test.dart +++ b/packages/flutter/test/material/input_decorator_test.dart @@ -8,6 +8,7 @@ library; import 'dart:async'; +import 'dart:ui'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; @@ -1766,6 +1767,40 @@ void main() { expect(getIconStyle(tester, Icons.close)?.color, theme.colorScheme.error); }); + testWidgets('InputDecoration default floatingLabelStyle resolves hovered/focused states', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Material( + child: TextField( + focusNode: focusNode, + decoration: const InputDecoration( + labelText: 'label', + ), + ), + ), + ), + ); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(getLabelStyle(tester).color, theme.colorScheme.primary); + + // Hovered. + final Offset center = tester.getCenter(find.byType(TextField)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(getLabelStyle(tester).color, theme.colorScheme.onSurfaceVariant); + }); + testWidgets('InputDecorator prefix/suffix widgets', (WidgetTester tester) async { const Key pKey = Key('p'); const Key sKey = Key('s'); diff --git a/packages/flutter/test/material/outlined_button_test.dart b/packages/flutter/test/material/outlined_button_test.dart index 97da07b2c5..f5e5cd70f1 100644 --- a/packages/flutter/test/material/outlined_button_test.dart +++ b/packages/flutter/test/material/outlined_button_test.dart @@ -176,6 +176,59 @@ void main() { expect(material.type, MaterialType.button); }); + testWidgets('OutlinedButton default overlayColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return OutlinedButton( + onPressed: () {}, + focusNode: focusNode, + child: const Text('OutlinedButton'), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(OutlinedButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + }); + testWidgets('Does OutlinedButton work with hover', (WidgetTester tester) async { const Color hoverColor = Color(0xff001122); @@ -285,11 +338,6 @@ void main() { // Default, not disabled. await expectLater(tester, meetsGuideline(textContrastGuideline)); - // Focused. - focusNode.requestFocus(); - await tester.pumpAndSettle(); - await expectLater(tester, meetsGuideline(textContrastGuideline)); - // Hovered. final Offset center = tester.getCenter(find.byType(OutlinedButton)); final TestGesture gesture = await tester.createGesture( @@ -305,7 +353,13 @@ void main() { await tester.pump(); // Start the splash and highlight animations. await tester.pump(const Duration(milliseconds: 800)); // Wait for splash and highlight to be well under way. await expectLater(tester, meetsGuideline(textContrastGuideline)); - await gesture.removePointer(); + await gesture.up(); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + await expectLater(tester, meetsGuideline(textContrastGuideline)); }, skip: isBrowser, // https://github.com/flutter/flutter/issues/44115 ); diff --git a/packages/flutter/test/material/radio_test.dart b/packages/flutter/test/material/radio_test.dart index e78cfde123..fe760ca42f 100644 --- a/packages/flutter/test/material/radio_test.dart +++ b/packages/flutter/test/material/radio_test.dart @@ -1029,7 +1029,7 @@ void main() { color: const Color(0xffffffff), rect: const Rect.fromLTRB(350.0, 250.0, 450.0, 350.0), ) - ..circle(color: theme.useMaterial3 ? theme.colorScheme.primary.withOpacity(0.08) : Colors.black12) + ..circle(color: theme.useMaterial3 ? theme.colorScheme.primary.withOpacity(0.08) : theme.hoverColor) ..circle(color: hoveredFillColor), ); }); @@ -1438,4 +1438,69 @@ void main() { expect(find.byType(CupertinoRadio), findsNothing); } }); + + testWidgets('Radio default overlayColor and fillColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(debugLabel: 'Radio'); + tester.binding.focusManager.highlightStrategy = FocusHighlightStrategy.alwaysTraditional; + final bool material3 = theme.useMaterial3; + + Finder findRadio() { + return find.byWidgetPredicate((Widget widget) => widget is Radio); + } + + MaterialInkController? getRadioMaterial(WidgetTester tester) { + return Material.of(tester.element(findRadio())); + } + await tester.pumpWidget(MaterialApp( + theme: theme, + home: Scaffold( + body: Radio( + focusNode: focusNode, + value: true, + groupValue: true, + onChanged: (_) { }, + ), + ), + )); + + // Hover + final Offset center = tester.getCenter(find.byType(Radio)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + + expect(getRadioMaterial(tester), + paints + ..circle(color: material3 ? theme.colorScheme.primary.withOpacity(0.08) : theme.hoverColor) + ..circle(color: material3 ? theme.colorScheme.primary : theme.colorScheme.secondary) + ); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + + expect(getRadioMaterial(tester), + paints + ..circle(color: material3 ? theme.colorScheme.onSurface.withOpacity(0.12) : theme.colorScheme.secondary.withAlpha(kRadialReactionAlpha)) + ..circle(color: material3 ? theme.colorScheme.primary : theme.colorScheme.secondary) + ); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + + expect(getRadioMaterial(tester), + paints + ..circle(color: material3 ? theme.colorScheme.primary.withOpacity(0.12) : theme.focusColor) + ..circle(color: material3 ? theme.colorScheme.primary : theme.colorScheme.secondary) + ); + }); } diff --git a/packages/flutter/test/material/segmented_button_test.dart b/packages/flutter/test/material/segmented_button_test.dart index 99d4866b04..ff863a860c 100644 --- a/packages/flutter/test/material/segmented_button_test.dart +++ b/packages/flutter/test/material/segmented_button_test.dart @@ -4,10 +4,13 @@ // This file is run as part of a reduced test set in CI on Mac and Windows // machines. +import 'dart:ui'; + import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; import 'package:flutter_test/flutter_test.dart'; +import '../rendering/mock_canvas.dart'; import '../widgets/semantics_tester.dart'; Widget boilerplate({required Widget child}) { @@ -482,4 +485,52 @@ testWidgets('SegmentedButton shows checkboxes for selected segments', (WidgetTes semantics.dispose(); }); + + testWidgets('SegmentedButton default overlayColor and foregroundColor resolve pressed state', (WidgetTester tester) async { + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: SegmentedButton( + segments: const >[ + ButtonSegment(value: 1, label: Text('1')), + ButtonSegment(value: 2, label: Text('2')), + ], + selected: const {1}, + onSelectionChanged: (Set selected) {}, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + final Material material = tester.widget(find.descendant( + of: find.byType(TextButton), + matching: find.byType(Material), + )); + + // Hovered. + final Offset center = tester.getCenter(find.text('2')); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + expect(material.textStyle?.color, theme.colorScheme.onSurface); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSurface.withOpacity(0.12))); + expect(material.textStyle?.color, theme.colorScheme.onSurface); + }); } diff --git a/packages/flutter/test/material/slider_test.dart b/packages/flutter/test/material/slider_test.dart index ca20f3feb1..c4b01ff4ce 100644 --- a/packages/flutter/test/material/slider_test.dart +++ b/packages/flutter/test/material/slider_test.dart @@ -1855,6 +1855,20 @@ void main() { paints..circle(color: theme.colorScheme.primary.withOpacity(0.08)), ); + // Slider still shows correct hovered color after pressing/dragging + await gesture.down(tester.getCenter(find.byType(Slider))); + await tester.pump(); + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0.0, 100.0)); + await tester.pumpAndSettle(); + await gesture.moveTo(tester.getCenter(find.byType(Slider))); + await tester.pumpAndSettle(); + expect( + Material.of(tester.element(find.byType(Slider))), + paints..circle(color: theme.colorScheme.primary.withOpacity(0.08)), + ); + // Slider does not have an overlay when disabled and hovered. await tester.pumpWidget(buildApp(enabled: false)); await tester.pumpAndSettle(); diff --git a/packages/flutter/test/material/switch_test.dart b/packages/flutter/test/material/switch_test.dart index 0c10a7bc15..4ae75254fc 100644 --- a/packages/flutter/test/material/switch_test.dart +++ b/packages/flutter/test/material/switch_test.dart @@ -461,6 +461,52 @@ void main() { ); }); + testWidgets('Switch default overlayColor resolves hovered/focused state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(debugLabel: 'Switch'); + tester.binding.focusManager.highlightStrategy = FocusHighlightStrategy.alwaysTraditional; + final bool material3 = theme.useMaterial3; + + Finder findSwitch() { + return find.byWidgetPredicate((Widget widget) => widget is Switch); + } + + MaterialInkController? getSwitchMaterial(WidgetTester tester) { + return Material.of(tester.element(findSwitch())); + } + await tester.pumpWidget(MaterialApp( + theme: theme, + home: Scaffold( + body: Switch( + focusNode: focusNode, + value: true, + onChanged: (_) { }, + ), + ), + )); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + + expect(getSwitchMaterial(tester), + paints + ..circle(color: material3 ? theme.colorScheme.primary.withOpacity(0.12) : theme.focusColor) + ); + + // On both hovered and focused, the overlay color should show hovered overlay color. + final Offset center = tester.getCenter(find.byType(Switch)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + + expect(getSwitchMaterial(tester), + paints..circle(color: material3 ? theme.colorScheme.primary.withOpacity(0.08) : theme.hoverColor) + ); + }); + testWidgets('Switch can be set color', (WidgetTester tester) async { bool value = false; await tester.pumpWidget( @@ -1320,7 +1366,7 @@ void main() { color: const Color(0x802196f3), rrect: RRect.fromLTRBR(13.0, 17.0, 46.0, 31.0, const Radius.circular(7.0)), ) - ..circle(color: const Color(0x1f000000)) + ..circle() // Radial reaction ..rrect(color: const Color(0x33000000)) ..rrect(color: const Color(0x24000000)) ..rrect(color: const Color(0x1f000000)) @@ -1341,7 +1387,7 @@ void main() { color: const Color(0x802196f3), rrect: RRect.fromLTRBR(13.0, 17.0, 46.0, 31.0, const Radius.circular(7.0)), ) - ..circle(color: const Color(0x1f000000)) + ..circle() ..rrect(color: const Color(0x33000000)) ..rrect(color: const Color(0x24000000)) ..rrect(color: const Color(0x1f000000)) diff --git a/packages/flutter/test/material/tabs_test.dart b/packages/flutter/test/material/tabs_test.dart index ed25108693..5072a74557 100644 --- a/packages/flutter/test/material/tabs_test.dart +++ b/packages/flutter/test/material/tabs_test.dart @@ -553,16 +553,31 @@ void main() { ), ); + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse); await gesture.addPointer(); await gesture.moveTo(tester.getCenter(find.text(selectedValue))); await tester.pumpAndSettle(); - final RenderObject inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); - expect(inkFeatures, paints..rect(color: theme.colorScheme.primary.withOpacity(0.08))); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.08))); + + await gesture.down(tester.getCenter(find.text(selectedValue))); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + await gesture.up(); + await tester.pumpAndSettle(); await gesture.moveTo(tester.getCenter(find.text(unselectedValue))); await tester.pumpAndSettle(); - expect(inkFeatures, paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + + await gesture.down(tester.getCenter(find.text(selectedValue))); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + await gesture.up(); + await tester.pumpAndSettle(); }); testWidgets('TabBar default overlay (secondary)', (WidgetTester tester) async { @@ -578,16 +593,29 @@ void main() { ), ); + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse); await gesture.addPointer(); await gesture.moveTo(tester.getCenter(find.text(selectedValue))); await tester.pumpAndSettle(); - final RenderObject inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); - expect(inkFeatures, paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + + await gesture.down(tester.getCenter(find.text(selectedValue))); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSurface.withOpacity(0.12))); + await gesture.up(); + await tester.pumpAndSettle(); await gesture.moveTo(tester.getCenter(find.text(unselectedValue))); await tester.pumpAndSettle(); - expect(inkFeatures, paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + expect(overlayColor(), paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.08))); + + await gesture.down(tester.getCenter(find.text(selectedValue))); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.onSurface.withOpacity(0.12))); }); testWidgets('TabBar tap selects tab', (WidgetTester tester) async { diff --git a/packages/flutter/test/material/text_button_test.dart b/packages/flutter/test/material/text_button_test.dart index 0274840674..31ae30c2a8 100644 --- a/packages/flutter/test/material/text_button_test.dart +++ b/packages/flutter/test/material/text_button_test.dart @@ -177,11 +177,6 @@ void main() { // Default, not disabled. await expectLater(tester, meetsGuideline(textContrastGuideline)); - // Focused. - focusNode.requestFocus(); - await tester.pumpAndSettle(); - await expectLater(tester, meetsGuideline(textContrastGuideline)); - // Hovered. final Offset center = tester.getCenter(find.byType(TextButton)); final TestGesture gesture = await tester.createGesture( @@ -197,8 +192,12 @@ void main() { await tester.pump(); // Start the splash and highlight animations. await tester.pump(const Duration(milliseconds: 800)); // Wait for splash and highlight to be well under way. await expectLater(tester, meetsGuideline(textContrastGuideline)); - await gesture.removePointer(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + await expectLater(tester, meetsGuideline(textContrastGuideline)); }, skip: isBrowser, // https://github.com/flutter/flutter/issues/44115 ); @@ -270,6 +269,59 @@ void main() { skip: isBrowser, // https://github.com/flutter/flutter/issues/44115 ); + testWidgets('TextButton default overlayColor resolves pressed state', (WidgetTester tester) async { + final FocusNode focusNode = FocusNode(); + final ThemeData theme = ThemeData(useMaterial3: true); + + await tester.pumpWidget( + MaterialApp( + theme: theme, + home: Scaffold( + body: Center( + child: Builder( + builder: (BuildContext context) { + return TextButton( + onPressed: () {}, + focusNode: focusNode, + child: const Text('TextButton'), + ); + }, + ), + ), + ), + ), + ); + + RenderObject overlayColor() { + return tester.allRenderObjects.firstWhere((RenderObject object) => object.runtimeType.toString() == '_RenderInkFeatures'); + } + + // Hovered. + final Offset center = tester.getCenter(find.byType(TextButton)); + final TestGesture gesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await gesture.addPointer(); + await gesture.moveTo(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.08))); + + // Highlighted (pressed). + await gesture.down(center); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect()..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + // Remove pressed and hovered states + await gesture.up(); + await tester.pumpAndSettle(); + await gesture.moveTo(const Offset(0, 50)); + await tester.pumpAndSettle(); + + // Focused. + focusNode.requestFocus(); + await tester.pumpAndSettle(); + expect(overlayColor(), paints..rect(color: theme.colorScheme.primary.withOpacity(0.12))); + }); + testWidgets('TextButton uses stateful color for text color in different states', (WidgetTester tester) async { final FocusNode focusNode = FocusNode(); diff --git a/packages/flutter/test/material/toggle_buttons_test.dart b/packages/flutter/test/material/toggle_buttons_test.dart index 0a04140a56..40db27a1f2 100644 --- a/packages/flutter/test/material/toggle_buttons_test.dart +++ b/packages/flutter/test/material/toggle_buttons_test.dart @@ -808,12 +808,28 @@ void main() { final Offset center = tester.getCenter(find.text('First child')); + // hoverColor + final TestGesture hoverGesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await hoverGesture.addPointer(); + await hoverGesture.moveTo(center); + await tester.pumpAndSettle(); + await hoverGesture.moveTo(Offset.zero); + + RenderObject inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) { + return object.runtimeType.toString() == '_RenderInkFeatures'; + }); + expect( + inkFeatures, + paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.04)), + ); + // splashColor final TestGesture touchGesture = await tester.createGesture(); - await touchGesture.down(center); + await touchGesture.down(center); // The button is on hovered and pressed await tester.pumpAndSettle(); - RenderObject inkFeatures; inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) { return object.runtimeType.toString() == '_RenderInkFeatures'; }); @@ -825,23 +841,8 @@ void main() { await touchGesture.up(); await tester.pumpAndSettle(); - - // hoverColor - final TestGesture hoverGesture = await tester.createGesture( - kind: PointerDeviceKind.mouse, - ); - await hoverGesture.addPointer(); - await hoverGesture.moveTo(center); + await hoverGesture.moveTo(const Offset(0, 50)); await tester.pumpAndSettle(); - await hoverGesture.moveTo(Offset.zero); - - inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) { - return object.runtimeType.toString() == '_RenderInkFeatures'; - }); - expect( - inkFeatures, - paints..rect(color: theme.colorScheme.onSurface.withOpacity(0.04)), - ); // focusColor focusNode.requestFocus(); @@ -874,12 +875,28 @@ void main() { final Offset center = tester.getCenter(find.text('First child')); - // splashColor - final TestGesture touchGesture = await tester.createGesture(); - await touchGesture.down(center); + // hoverColor + final TestGesture hoverGesture = await tester.createGesture( + kind: PointerDeviceKind.mouse, + ); + await hoverGesture.addPointer(); + await hoverGesture.moveTo(center); + await tester.pumpAndSettle(); + + RenderObject inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) { + return object.runtimeType.toString() == '_RenderInkFeatures'; + }); + expect( + inkFeatures, + paints..rect(color: theme.colorScheme.primary.withOpacity(0.04)), + ); + await hoverGesture.moveTo(Offset.zero); + + // splashColor + final TestGesture touchGesture = await tester.createGesture(); + await touchGesture.down(center); // The button is on hovered and pressed await tester.pumpAndSettle(); - RenderObject inkFeatures; inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) { return object.runtimeType.toString() == '_RenderInkFeatures'; }); @@ -891,24 +908,9 @@ void main() { await touchGesture.up(); await tester.pumpAndSettle(); - - // hoverColor - final TestGesture hoverGesture = await tester.createGesture( - kind: PointerDeviceKind.mouse, - ); - await hoverGesture.addPointer(); - await hoverGesture.moveTo(center); + await hoverGesture.moveTo(const Offset(0, 50)); await tester.pumpAndSettle(); - inkFeatures = tester.allRenderObjects.firstWhere((RenderObject object) { - return object.runtimeType.toString() == '_RenderInkFeatures'; - }); - expect( - inkFeatures, - paints..rect(color: theme.colorScheme.primary.withOpacity(0.04)), - ); - await hoverGesture.moveTo(Offset.zero); - // focusColor focusNode.requestFocus(); await tester.pumpAndSettle();