Flutter: Disabling Multi-Touch/Drag with Gesture Detector

Question

Im currently building a Slider widget which multiple handle and am currently implementing the Gesture Detector. I am having an issue where if you touch/drag the screen with a second finger it will be recognised by the detector and call the onDragUpdate function, which is what I am trying to disable - whilst one finger is dragging the handle around, the gesture detector shouldn't call updates for a second finger but should still allow the first finger to call the updates.

For example, if you're sliding the handle around with finger 1 (fine) and then add a second finger, finger 2, the gesture detector should only recognise finger 1 even though both fingers are on screen.

I understand there is a function in the Listener class which allows you to specify a device (using details.device) but is there a way to achieve this using the Gesture Detector class?

Currently looking into different implementers for the Gesture Detector, including looking at this answer https://stackoverflow.com/a/56037327/12147590 but i'm still struggling. If anyone could point me in the right direction or explain the answer further in simple terms for me that would be great, cheers :)

Are you sure, you actually need implementing your own slider? The on that is in the box is pretty customizable — Dmytro Rostopira, Oct 01 '19 at 09:46
Here it is, was released in Flutter 1.7: https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d (and reference link just in case: https://api.flutter.dev/flutter/material/RangeSlider-class.html) — Dmytro Rostopira, Oct 01 '19 at 09:53
I see you edited question. Just set an empty but non-null handlers for all multi-touch gestures — Dmytro Rostopira, Oct 01 '19 at 09:56
The app itself is based off custom widgets and this particular slider allows the use of more than 2 handles on the same slider (which the material apps don't implement) — eFlat, Oct 01 '19 at 09:57
More than 2 handlers? 0_o I've done many strange concepts, but that seems ridiculous)) — Dmytro Rostopira, Oct 01 '19 at 09:58

Dmytro Rostopira · Answer 1 · 2019-10-01T11:36:40.043

3

According to the class reference:

Attempts to recognize gestures that correspond to its non-null callbacks.

So if you write it like this:

GestureDetector(
  onDragUpdate: (updateDetails) {
    // Single finger drag, update your handlers
  },
  onPanDown: (_){}, 
  onPanStart: (_){}, 
  onPanUpdate: (_){}, 
  onPanEnd: (_){}, 
  onPanCancel: (){},
  child: Container(
    color: Colors.yellow,
    child: Text('TURN LIGHTS ON'),
  ),
)

It won't react on multi-touch, so you don't have to disable anything

UPD: according to question edit, you should set empty but non-null callbacks for all multi-touch events, so two fingers drag will be handled by empty callback, but single finger not

edited Oct 01 '19 at 11:36

answered Oct 01 '19 at 09:45

Dmytro Rostopira

10,588
4
64
86

Using both the Pan and Scale callbacks gave an error as "scale is a superset of pan". Tried just using the scale callbacks but that hasn't solved the issue. – eFlat Oct 01 '19 at 10:32
Nope, that doesn't work either :/ There really needs to be a way to specify a pointer (just like you can do in the listener class) – eFlat Oct 01 '19 at 12:06
I also just realised - this solution solve the full problem as I would still want the first finger to update the widget (even if the second finger is on screen). – eFlat Oct 01 '19 at 13:47

score 1 · Accepted Answer · answered Oct 09 '19 at 15:37

1

Whilst I was working on another separate problem I happened to have also solved this problem by using the solution here

answered Oct 09 '19 at 15:37

eFlat

182
4
15

Flutter: Disabling Multi-Touch/Drag with Gesture Detector

2 Answers2

Linked