Search code examples
flutterdartgesture

Receive "onVerticalDragUpdate" on nested "GestureDetectors" in Flutter


The following snippet is just a minimalized version of my real situation. In my real situation these GestureDetectors are inside different widgets. My problem is, that the onVerticalDragUpdate event is only received by the inner GestureDetector. I even set the behavior of the inner GestureDetector to HitTestBehavior.translucent, which means that the event should bubble up to parent widgets. Or am I getting there something wrong?

void main() {
  debugPaintPointersEnabled = true;
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
        onVerticalDragUpdate: (details) {
          var test = "test";
        },
        child: GestureDetector(
          behavior: HitTestBehavior.translucent,
          onVerticalDragUpdate: (details) {
            var test = "test";
          },
          child: Container(height: 100, width: 100, color: Colors.red),
        ));
  }
}

Solution

  • For everyone who is interested, this was how I solved it:

    class _MyAppState extends State<MyApp> {
      @override
      Widget build(BuildContext context) {
        return RawGestureDetector(
            gestures: {
              AllowMultipleVerticalDragGestureRecognizer: GestureRecognizerFactoryWithHandlers<
                  AllowMultipleVerticalDragGestureRecognizer>(
                () => AllowMultipleVerticalDragGestureRecognizer(),
                (AllowMultipleVerticalDragGestureRecognizer instance) {
                  instance..onEnd = (_) => print("test1");
                },
              )
            },
            child: RawGestureDetector(
              gestures: {
                AllowMultipleVerticalDragGestureRecognizer: GestureRecognizerFactoryWithHandlers<
                    AllowMultipleVerticalDragGestureRecognizer>(
                  () => AllowMultipleVerticalDragGestureRecognizer(),
                  (AllowMultipleVerticalDragGestureRecognizer instance) {
                    instance..onEnd = (_) => print("test2");
                  },
                )
              },
              child: Container(color: Colors.red),
            ));
      }
    }
    
    class AllowMultipleVerticalDragGestureRecognizer extends VerticalDragGestureRecognizer{
      @override
      void rejectGesture(int pointer) {
        acceptGesture(pointer);
      }
    }
    

    Credit: https://gist.github.com/Nash0x7E2/08acca529096d93f3df0f60f9c034056