Migrate to raw gesture detector

example/lib/main.dart

@@ -18,6 +18,7 @@ class MyHomePage extends StatefulWidget {
 }
 
 class _MyHomePageState extends State<MyHomePage> {
+  List<double> t = [0.1, 0.2];
   List<double> monday = [0.1, 0.2];
   List<double> tuesday = [0.1, 0.2, 0.4, 0.5];
   List<double> wednesday = [0.1, 0.2];
@@ -35,42 +36,55 @@ class _MyHomePageState extends State<MyHomePage> {
       appBar: AppBar(
         title: Text('MultiSlider'),
       ),
-      body: ListView(
-        children: <Widget>[
-          WeekDaySchedule(
-            weekDay: 'Monday',
-            values: monday,
-            onChanged: (value) => setState(() => monday = value),
-            enabled: mondayEnabled,
-            onToggle: (value) => setState(() => mondayEnabled = value),
-          ),
-          WeekDaySchedule(
-            weekDay: 'Tuesday',
-            values: tuesday,
-            onChanged: (value) => setState(() => tuesday = value),
-            enabled: tuesdayEnabled,
-            onToggle: (value) => setState(() => tuesdayEnabled = value),
-          ),
-          WeekDaySchedule(
-            weekDay: 'Wednesday',
-            values: wednesday,
-            onChanged: (value) => setState(() => wednesday = value),
-            enabled: wednesdayEnabled,
-            onToggle: (value) => setState(() => wednesdayEnabled = value),
-          ),
-          WeekDaySchedule(
-            weekDay: 'Thursday',
-            values: thursday,
-            onChanged: (value) => setState(() => thursday = value),
-            enabled: thursdayEnabled,
-            onToggle: (value) => setState(() => thursdayEnabled = value),
+      body: Column(
+        children: [
+          Padding(
+            padding: const EdgeInsets.only(left: 50),
+            child: MultiSlider(
+              values: t,
+              onChanged: (value) => setState(() => t = value),
+            ),
           ),
-          WeekDaySchedule(
-            weekDay: 'Friday',
-            values: friday,
-            onChanged: (value) => setState(() => friday = value),
-            enabled: fridayEnabled,
-            onToggle: (value) => setState(() => fridayEnabled = value),
+          Expanded(
+            child: ListView(
+              children: <Widget>[
+                WeekDaySchedule(
+                  weekDay: 'Monday',
+                  values: monday,
+                  onChanged: (value) => setState(() => monday = value),
+                  enabled: mondayEnabled,
+                  onToggle: (value) => setState(() => mondayEnabled = value),
+                ),
+                WeekDaySchedule(
+                  weekDay: 'Tuesday',
+                  values: tuesday,
+                  onChanged: (value) => setState(() => tuesday = value),
+                  enabled: tuesdayEnabled,
+                  onToggle: (value) => setState(() => tuesdayEnabled = value),
+                ),
+                WeekDaySchedule(
+                  weekDay: 'Wednesday',
+                  values: wednesday,
+                  onChanged: (value) => setState(() => wednesday = value),
+                  enabled: wednesdayEnabled,
+                  onToggle: (value) => setState(() => wednesdayEnabled = value),
+                ),
+                WeekDaySchedule(
+                  weekDay: 'Thursday',
+                  values: thursday,
+                  onChanged: (value) => setState(() => thursday = value),
+                  enabled: thursdayEnabled,
+                  onToggle: (value) => setState(() => thursdayEnabled = value),
+                ),
+                WeekDaySchedule(
+                  weekDay: 'Friday',
+                  values: friday,
+                  onChanged: (value) => setState(() => friday = value),
+                  enabled: fridayEnabled,
+                  onToggle: (value) => setState(() => fridayEnabled = value),
+                ),
+              ],
+            ),
           ),
         ],
       ), // This trailing comma makes auto-formatting nicer for build methods.

lib/flutter_multi_slider.dart

@@ -1,3 +1,8 @@
 library flutter_multi_slider;
 
-export './src/multi_slider.dart' show MultiSlider;
+import 'dart:math' as math;
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+
+part 'src/custom_gesture_detector.dart';
+part 'src/multi_slider.dart';

lib/src/custom_gesture_detector.dart

@@ -0,0 +1,78 @@
+part of flutter_multi_slider;
+
+class _CustomGestureDetector extends StatelessWidget {
+  final ValueChanged<Offset>? onPanStart;
+  final ValueChanged<Offset>? onPanUpdate;
+  final ValueChanged<Offset>? onPanEnd;
+  final Widget child;
+
+  const _CustomGestureDetector({
+    required this.onPanStart,
+    required this.onPanUpdate,
+    required this.onPanEnd,
+    required this.child,
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    ValueChanged<Offset> globalToLocalWrapper(ValueChanged<Offset>? callback) =>
+        (Offset globalOffset) {
+          final renderBox = context.findRenderObject()! as RenderBox;
+          callback?.call(renderBox.globalToLocal(globalOffset));
+        };
+
+    return RawGestureDetector(
+      gestures: {
+        _CustomPanGestureRecognizer:
+            GestureRecognizerFactoryWithHandlers<_CustomPanGestureRecognizer>(
+          () => _CustomPanGestureRecognizer(
+            onPanStart: globalToLocalWrapper(onPanStart),
+            onPanUpdate: globalToLocalWrapper(onPanUpdate),
+            onPanEnd: globalToLocalWrapper(onPanEnd),
+          ),
+          (_CustomPanGestureRecognizer instance) {},
+        ),
+      },
+      child: child,
+    );
+  }
+}
+
+class _CustomPanGestureRecognizer extends OneSequenceGestureRecognizer {
+  final ValueChanged<Offset> onPanStart;
+  final ValueChanged<Offset> onPanUpdate;
+  final ValueChanged<Offset> onPanEnd;
+
+  _CustomPanGestureRecognizer({
+    required this.onPanStart,
+    required this.onPanUpdate,
+    required this.onPanEnd,
+  });
+
+  @override
+  void addPointer(PointerEvent event) {
+    startTrackingPointer(event.pointer);
+    resolve(GestureDisposition.accepted);
+  }
+
+  @override
+  void handleEvent(PointerEvent event) {
+    if (event is PointerDownEvent) {
+      onPanStart.call(event.position);
+    }
+    if (event is PointerMoveEvent) {
+      onPanUpdate.call(event.position);
+    }
+    if (event is PointerUpEvent) {
+      onPanEnd.call(event.position);
+      stopTrackingPointer(event.pointer);
+    }
+  }
+
+  @override
+  void didStopTrackingLastPointer(int pointer) {}
+
+  @override
+  String get debugDescription => 'CustomPanGestureRecognizer';
+}

lib/src/multi_slider.dart

@@ -1,5 +1,4 @@
-import 'package:flutter/material.dart';
-import 'dart:math' as math;
+part of flutter_multi_slider;
 
 /// Used in [ValueRangePainterCallback] as parameter.
 /// Every range between the edges of [MultiSlider] generate an [ValueRange].
@@ -111,7 +110,7 @@ class _MultiSliderState extends State<MultiSlider> {
     return LayoutBuilder(
       builder: (context, BoxConstraints constraints) {
         _maxWidth = constraints.maxWidth;
-        return GestureDetector(
+        return _CustomGestureDetector(
           child: Container(
             constraints: constraints,
             width: double.infinity,
@@ -149,25 +148,25 @@ class _MultiSliderState extends State<MultiSlider> {
     );
   }
 
-  void _handleOnChangeStart(DragStartDetails details) {
+  void _handleOnChangeStart(Offset details) {
     double valuePosition = _convertPixelPositionToValue(
-      details.localPosition.dx,
+      details.dx,
     );
 
     int index = _findNearestValueIndex(valuePosition);
 
     setState(() => _selectedInputIndex = index);
 
-    final updatedValues = updateInternalValues(details.localPosition.dx);
+    final updatedValues = updateInternalValues(details.dx);
     widget.onChanged!(updatedValues);
     if (widget.onChangeStart != null) widget.onChangeStart!(updatedValues);
   }
 
-  void _handleOnChanged(DragUpdateDetails details) {
-    widget.onChanged!(updateInternalValues(details.localPosition.dx));
+  void _handleOnChanged(Offset details) {
+    widget.onChanged!(updateInternalValues(details.dx));
   }
 
-  void _handleOnChangeEnd(DragEndDetails details) {
+  void _handleOnChangeEnd(Offset details) {
     setState(() => _selectedInputIndex = null);
 
     if (widget.onChangeEnd != null) widget.onChangeEnd!(widget.values);