Merge pull request #208 from gskinnerTeam/accessability-trackpadfix

Accessibility - Trackpad Fix

lib/ui/common/controls/eight_way_swipe_detector.dart

@@ -1,4 +1,6 @@
+import 'package:flutter/gestures.dart';
 import 'package:wonders/common_libs.dart';
+import 'package:wonders/ui/common/controls/trackpad_listener.dart';
 
 class EightWaySwipeDetector extends StatefulWidget {
   const EightWaySwipeDetector({super.key, required this.child, this.threshold = 50, required this.onSwipe});
@@ -40,12 +42,16 @@ class _EightWaySwipeDetectorState extends State<EightWaySwipeDetector> {
     }
   }
 
-  void _handleSwipeStart(d) {
+  void _trackpadSwipe(Offset delta) {
-    _isSwiping = true;
+    widget.onSwipe?.call(delta);
+  }
+
+  void _handleSwipeStart(DragStartDetails d) {
+    _isSwiping = d.kind != null;
     _startPos = _endPos = d.localPosition;
   }
 
-  void _handleSwipeUpdate(d) {
+  void _handleSwipeUpdate(DragUpdateDetails d) {
     _endPos = d.localPosition;
     _maybeTriggerSwipe();
   }
@@ -57,12 +63,24 @@ class _EightWaySwipeDetectorState extends State<EightWaySwipeDetector> {
 
   @override
   Widget build(BuildContext context) {
-    return GestureDetector(
+    return TrackpadListener(
+      scrollSensitivity: 70,
+      onScroll: _trackpadSwipe,
+      child: GestureDetector(
         behavior: HitTestBehavior.translucent,
         onPanStart: _handleSwipeStart,
         onPanUpdate: _handleSwipeUpdate,
         onPanCancel: _resetSwipe,
         onPanEnd: _handleSwipeEnd,
-        child: widget.child);
+        supportedDevices: const {
+          // Purposely omitting PointerDeviceKind.trackpad.
+          PointerDeviceKind.mouse,
+          PointerDeviceKind.stylus,
+          PointerDeviceKind.touch,
+          PointerDeviceKind.unknown,
+        },
+        child: widget.child,
+      ),
+    );
   }
 }

lib/ui/common/controls/trackpad_listener.dart

@@ -0,0 +1,69 @@
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+
+class TrackpadListener extends StatefulWidget {
+  final Widget? child;
+  final double scrollSensitivity;
+  final ValueChanged<Offset>? onScroll;
+
+  const TrackpadListener({
+    super.key,
+    this.child,
+    this.scrollSensitivity = 100,
+    this.onScroll,
+  });
+
+  @override
+  State<TrackpadListener> createState() => _TrackpadListenerState();
+}
+
+class _TrackpadListenerState extends State<TrackpadListener> {
+  Offset _scrollOffset = Offset.zero;
+
+  void _handleTrackpadEvent(PointerSignalEvent event) {
+    // Directly process the event here.
+    if (event is PointerScrollEvent && event.kind == PointerDeviceKind.trackpad) {
+      Offset newScroll = _scrollOffset + event.scrollDelta;
+      newScroll = Offset(
+        newScroll.dx.clamp(-widget.scrollSensitivity, widget.scrollSensitivity),
+        newScroll.dy.clamp(-widget.scrollSensitivity, widget.scrollSensitivity),
+      );
+      _scrollOffset = newScroll;
+      _update();
+    }
+  }
+
+  void _update() {
+    Offset directionScroll = Offset.zero;
+    double sensitivity = widget.scrollSensitivity;
+    if (_scrollOffset.dy >= sensitivity) {
+      // Scroll down
+      _scrollOffset += Offset(0.0, -sensitivity);
+      directionScroll += Offset(0.0, -1.0);
+    } else if (_scrollOffset.dy <= -sensitivity) {
+      // Scroll up
+      _scrollOffset += Offset(0.0, sensitivity);
+      directionScroll += Offset(0.0, 1.0);
+    }
+    if (_scrollOffset.dx >= sensitivity) {
+      // Scroll left
+      _scrollOffset += Offset(-sensitivity, 0.0);
+      directionScroll += Offset(-1.0, 0.0);
+    } else if (_scrollOffset.dx <= -sensitivity) {
+      // Scroll right
+      _scrollOffset += Offset(sensitivity, 0.0);
+      directionScroll += Offset(1.0, 0.0);
+    }
+    if (directionScroll != Offset.zero) {
+      widget.onScroll?.call(directionScroll);
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Listener(
+      onPointerSignal: _handleTrackpadEvent,
+      child: widget.child,
+    );
+  }
+}

lib/ui/screens/editorial/editorial_screen.dart

@@ -13,6 +13,7 @@ import 'package:wonders/ui/common/app_icons.dart';
 import 'package:wonders/ui/common/blend_mask.dart';
 import 'package:wonders/ui/common/centered_box.dart';
 import 'package:wonders/ui/common/compass_divider.dart';
+import 'package:wonders/ui/common/controls/trackpad_listener.dart';
 import 'package:wonders/ui/common/curved_clippers.dart';
 import 'package:wonders/ui/common/fullscreen_keyboard_list_scroller.dart';
 import 'package:wonders/ui/common/google_maps_marker.dart';
@@ -66,6 +67,13 @@ class _WonderEditorialScreenState extends State<WonderEditorialScreen> {
     _scrollPos.value = _scroller.position.pixels;
   }
 
+  void _handleTrackpadScroll(Offset direction) {
+    // Trackpad swipe up. Return to home if at the top.
+    if (_scroller.position.pixels == 0 && direction.dy > 0) {
+      _handleBackPressed();
+    }
+  }
+
   void _handleBackPressed() => context.go(ScreenPaths.home);
 
   @override
@@ -82,6 +90,9 @@ class _WonderEditorialScreenState extends State<WonderEditorialScreen> {
         controller: _scroller,
         child: ColoredBox(
           color: $styles.colors.offWhite,
+          child: TrackpadListener(
+            onScroll: _handleTrackpadScroll,
+            scrollSensitivity: 120,
             child: Stack(
               children: [
                 /// Background
@@ -193,6 +204,7 @@ class _WonderEditorialScreenState extends State<WonderEditorialScreen> {
               ],
             ),
           ),
+        ),
       );
     });
   }

lib/ui/screens/home/wonders_home_screen.dart

@@ -4,6 +4,7 @@ import 'package:wonders/logic/data/wonder_data.dart';
 import 'package:wonders/ui/common/app_icons.dart';
 import 'package:wonders/ui/common/controls/app_header.dart';
 import 'package:wonders/ui/common/controls/app_page_indicator.dart';
+import 'package:wonders/ui/common/controls/trackpad_listener.dart';
 import 'package:wonders/ui/common/gradient_container.dart';
 import 'package:wonders/ui/common/ignore_pointer.dart';
 import 'package:wonders/ui/common/previous_next_navigation.dart';
@@ -133,6 +134,12 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
     }
   }
 
+  void _handleTrackpadScroll(Offset direction) {
+    if (direction.dy < 0) {
+      _showDetailsPage();
+    }
+  }
+
   @override
   Widget build(BuildContext context) {
     if (_fadeInOnNextBuild == true) {
@@ -142,6 +149,9 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
 
     return _swipeController.wrapGestureDetector(Container(
       color: $styles.colors.black,
+      child: TrackpadListener(
+        scrollSensitivity: 60,
+        onScroll: _handleTrackpadScroll,
         child: PreviousNextNavigation(
           listenToMouseWheel: false,
           onPreviousPressed: () => _handlePrevNext(-1),
@@ -162,6 +172,7 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
             ],
           ).maybeAnimate().fadeIn(),
         ),
+      ),
     ));
   }
 

lib/ui/screens/photo_gallery/photo_gallery.dart

@@ -228,7 +228,8 @@ class _PhotoGalleryState extends State<PhotoGallery> {
               ),
             ),
           );
-          }),
+        },
+      ),
     );
   }