在 Flutter 中的嵌套“GestureDetectors”上接收“onVerticalDragUpdate”答案

【问题标题】：Receive "onVerticalDragUpdate" on nested "GestureDetectors" in Flutter在 Flutter 中的嵌套“GestureDetectors”上接收“onVerticalDragUpdate”
【发布时间】：2019-09-27 16:10:38
【问题描述】：

下面的 sn-p 只是我真实情况的最小化版本。在我的真实情况下，这些GestureDetectors 位于不同的小部件中。我的问题是，onVerticalDragUpdate 事件仅由内部 GestureDetector 接收。我什至将内部GestureDetector 的behavior 设置为HitTestBehavior.translucent，这意味着事件应该冒泡到父小部件。还是我说错了？

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),
        ));
  }
}

【问题讨论】：

标签： flutter dart gesture

【解决方案1】：

对于所有感兴趣的人，这就是我解决它的方法：

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);
  }
}

信用：https://gist.github.com/Nash0x7E2/08acca529096d93f3df0f60f9c034056

【讨论】：

【解决方案2】：

嗯，这是你需要的吗？

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

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

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

顶部小部件是垂直的“test1”，内部小部件是拖动水平的“test2”。

我希望它可以帮助 Niklas ;-)

【讨论】：

谢谢，但我需要两次“onVerticalDragUpdate”。