From b2118918769788d04de8a274c25c7355d148fd15 Mon Sep 17 00:00:00 2001 From: Henry Riehl <73116038+whiskeyPeak@users.noreply.github.com> Date: Thu, 24 Aug 2023 22:45:21 +0100 Subject: [PATCH] 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 --- .../flutter/lib/src/material/ink_well.dart | 12 +++++++++- .../flutter/test/material/ink_well_test.dart | 24 +++++++++++++++++++ 2 files changed, 35 insertions(+), 1 deletion(-) diff --git a/packages/flutter/lib/src/material/ink_well.dart b/packages/flutter/lib/src/material/ink_well.dart index 157e2b3188..8814a847ad 100644 --- a/packages/flutter/lib/src/material/ink_well.dart +++ b/packages/flutter/lib/src/material/ink_well.dart @@ -332,6 +332,7 @@ class InkResponse extends StatelessWidget { this.onFocusChange, this.autofocus = false, this.statesController, + this.hoverDuration, }); /// The widget below this widget in the tree. @@ -621,6 +622,11 @@ class InkResponse extends StatelessWidget { /// {@endtemplate} final MaterialStatesController? statesController; + /// The duration of the animation that animates the hover effect. + /// + /// The default is 50ms. + final Duration? hoverDuration; + @override Widget build(BuildContext context) { final _ParentInkResponseState? parentState = _ParentInkResponseProvider.maybeOf(context); @@ -659,6 +665,7 @@ class InkResponse extends StatelessWidget { getRectCallback: getRectCallback, debugCheckContext: debugCheckContext, statesController: statesController, + hoverDuration: hoverDuration, child: child, ); } @@ -715,6 +722,7 @@ class _InkResponseStateWidget extends StatefulWidget { this.getRectCallback, required this.debugCheckContext, this.statesController, + this.hoverDuration, }); final Widget? child; @@ -752,6 +760,7 @@ class _InkResponseStateWidget extends StatefulWidget { final _GetRectCallback? getRectCallback; final _CheckContext debugCheckContext; final MaterialStatesController? statesController; + final Duration? hoverDuration; @override _InkResponseState createState() => _InkResponseState(); @@ -920,7 +929,7 @@ class _InkResponseState extends State<_InkResponseStateWidget> return const Duration(milliseconds: 200); case _HighlightType.hover: case _HighlightType.focus: - return const Duration(milliseconds: 50); + return widget.hoverDuration ?? const Duration(milliseconds: 50); } } @@ -1456,6 +1465,7 @@ class InkWell extends InkResponse { super.onFocusChange, super.autofocus, super.statesController, + super.hoverDuration, }) : super( containedInkWell: true, highlightShape: BoxShape.rectangle, diff --git a/packages/flutter/test/material/ink_well_test.dart b/packages/flutter/test/material/ink_well_test.dart index ed2a5411f3..8f3903ad9f 100644 --- a/packages/flutter/test/material/ink_well_test.dart +++ b/packages/flutter/test/material/ink_well_test.dart @@ -2229,4 +2229,28 @@ testWidgetsWithLeakTracking('InkResponse radius can be updated', (WidgetTester t await gesture.up(); }); + + testWidgetsWithLeakTracking('try out hoverDuration property', (WidgetTester tester) async { + final List log = []; + + 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(['tap'])); + log.clear(); + }); }