Unverified Commit b2118918 authored by Henry Riehl's avatar Henry Riehl Committed by GitHub

Add hover duration for `Inkwell` widget (#132176)

Adds a `hoverDuration` property to the `Inkwell` widget. This allows the user to customise how long the change in colour animates between the default colour and the hovered colour.

https://github.com/flutter/flutter/assets/73116038/2e7c5ccb-8651-4e08-8c7b-225cc005d594

Fixes #132170
parent cb72164a
...@@ -332,6 +332,7 @@ class InkResponse extends StatelessWidget { ...@@ -332,6 +332,7 @@ class InkResponse extends StatelessWidget {
this.onFocusChange, this.onFocusChange,
this.autofocus = false, this.autofocus = false,
this.statesController, this.statesController,
this.hoverDuration,
}); });
/// The widget below this widget in the tree. /// The widget below this widget in the tree.
...@@ -621,6 +622,11 @@ class InkResponse extends StatelessWidget { ...@@ -621,6 +622,11 @@ class InkResponse extends StatelessWidget {
/// {@endtemplate} /// {@endtemplate}
final MaterialStatesController? statesController; final MaterialStatesController? statesController;
/// The duration of the animation that animates the hover effect.
///
/// The default is 50ms.
final Duration? hoverDuration;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final _ParentInkResponseState? parentState = _ParentInkResponseProvider.maybeOf(context); final _ParentInkResponseState? parentState = _ParentInkResponseProvider.maybeOf(context);
...@@ -659,6 +665,7 @@ class InkResponse extends StatelessWidget { ...@@ -659,6 +665,7 @@ class InkResponse extends StatelessWidget {
getRectCallback: getRectCallback, getRectCallback: getRectCallback,
debugCheckContext: debugCheckContext, debugCheckContext: debugCheckContext,
statesController: statesController, statesController: statesController,
hoverDuration: hoverDuration,
child: child, child: child,
); );
} }
...@@ -715,6 +722,7 @@ class _InkResponseStateWidget extends StatefulWidget { ...@@ -715,6 +722,7 @@ class _InkResponseStateWidget extends StatefulWidget {
this.getRectCallback, this.getRectCallback,
required this.debugCheckContext, required this.debugCheckContext,
this.statesController, this.statesController,
this.hoverDuration,
}); });
final Widget? child; final Widget? child;
...@@ -752,6 +760,7 @@ class _InkResponseStateWidget extends StatefulWidget { ...@@ -752,6 +760,7 @@ class _InkResponseStateWidget extends StatefulWidget {
final _GetRectCallback? getRectCallback; final _GetRectCallback? getRectCallback;
final _CheckContext debugCheckContext; final _CheckContext debugCheckContext;
final MaterialStatesController? statesController; final MaterialStatesController? statesController;
final Duration? hoverDuration;
@override @override
_InkResponseState createState() => _InkResponseState(); _InkResponseState createState() => _InkResponseState();
...@@ -920,7 +929,7 @@ class _InkResponseState extends State<_InkResponseStateWidget> ...@@ -920,7 +929,7 @@ class _InkResponseState extends State<_InkResponseStateWidget>
return const Duration(milliseconds: 200); return const Duration(milliseconds: 200);
case _HighlightType.hover: case _HighlightType.hover:
case _HighlightType.focus: case _HighlightType.focus:
return const Duration(milliseconds: 50); return widget.hoverDuration ?? const Duration(milliseconds: 50);
} }
} }
...@@ -1456,6 +1465,7 @@ class InkWell extends InkResponse { ...@@ -1456,6 +1465,7 @@ class InkWell extends InkResponse {
super.onFocusChange, super.onFocusChange,
super.autofocus, super.autofocus,
super.statesController, super.statesController,
super.hoverDuration,
}) : super( }) : super(
containedInkWell: true, containedInkWell: true,
highlightShape: BoxShape.rectangle, highlightShape: BoxShape.rectangle,
......
...@@ -2229,4 +2229,28 @@ testWidgetsWithLeakTracking('InkResponse radius can be updated', (WidgetTester t ...@@ -2229,4 +2229,28 @@ testWidgetsWithLeakTracking('InkResponse radius can be updated', (WidgetTester t
await gesture.up(); await gesture.up();
}); });
testWidgetsWithLeakTracking('try out hoverDuration property', (WidgetTester tester) async {
final List<String> log = <String>[];
await tester.pumpWidget(Directionality(
textDirection: TextDirection.ltr,
child: Material(
child: Center(
child: InkWell(
hoverDuration: const Duration(milliseconds: 1000),
onTap: () {
log.add('tap');
},
),
),
),
));
await tester.tap(find.byType(InkWell), pointer: 1);
await tester.pump(const Duration(seconds: 1));
expect(log, equals(<String>['tap']));
log.clear();
});
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment