如何让 GestureDetector 检测 Flutter Web 中的两指拖动?

Mom*_*mar 7 smooth-scrolling flutter flutter-web

我正在尝试在 PageView 中实现平滑滚动,因此我已将属性设置physics为,并使用检测拖动手势的NeverScrollableScrollPhysics()构建器功能将项目包装在构建器功能中。GestureDetector当检测到拖动手势时,会触发一个功能,页面会发生相应的变化。

我的问题是,在 Flutter Web 上,onVerticalDragGesture仅在用三个手指拖动时才检测到,而在用两个手指滑动时没有任何反应。有什么办法可以解决这个问题吗?

顺便说一句,结果与属性相同onPanUpdate。请随意建议其他实现平滑滚动的方法。预先感谢各位。

如果您想重现它,这是我的代码:

PageView.builder(
 physics: NeverScrollableScrollPhysics(),
 controller: /* PAGECONTROLLER */,
 scrollDirection: Axis.vertical,
 pageSnapping: false,
 itemBuilder: (context, index) {
  return GestureDetector(
  onVerticalDragUpdate: (DragUpdateDetails details) {
  if (details.delta.dy > 5.0) {
   /* FUNCTION TO MOVE TO PREVIOUS PAGE */
  }
  if (details.delta.dy < -5.0) {
   /* FUNCTION TO MOVE TO NEXT PAGE */
  }
 },
 child: /* PAGES OF THE PAGEVIEW, JUST USE EMPTY CONTAINERS WITH DIFFERENT COLORS */,
 );
},
 itemCount: /* NUMBER OF PAGES */,
),
Run Code Online (Sandbox Code Playgroud)

小智 1

默认情况下,Flutter 中的 GestureDetector 仅检测单指手势。要检测多指手势,您可以使用带有 GestureRecognizer 的 Listener 小部件来识别多指手势。

以下代码片段可能有助于使用 Listener 和 PanGestureRecognizer:

    Listener(
  onPointerDown: (event) {
    if (event.kind == PointerDeviceKind.touch && event.pointer != 0) {
      // A second finger is down, start recognizing the gesture
      _gestureRecognizer.addPointer(event);
    }
  },
  onPointerUp: (event) {
    if (event.kind == PointerDeviceKind.touch && event.pointer != 0) {
      // The second finger is up, stop recognizing the gesture
      _gestureRecognizer.removePointer(event);
    }
  },
  child: Container(
    // Your widget tree
  ),
);

// Initialize the gesture recognizer in your widget state
PanGestureRecognizer _gestureRecognizer = PanGestureRecognizer()
  ..onStart = (details) {
    // This is called when the gesture starts
    // Check that it is a two-finger gesture before handling it
    if (_gestureRecognizer.numberOfPointers == 2) {
      // Handle the two-finger drag gesture
      print('Two-finger drag started');
    }
  }
  ..onUpdate = (details) {
    // This is called when the gesture is updated
    // Check that it is a two-finger gesture before handling it
    if (_gestureRecognizer.numberOfPointers == 2) {
      // Handle the two-finger drag gesture
      print('Two-finger drag updated');
    }
  }
  ..onEnd = (details) {
    // This is called when the gesture ends
    // Check that it is a two-finger gesture before handling it
    if (_gestureRecognizer.numberOfPointers == 2) {
      // Handle the two-finger drag gesture
      print('Two-finger drag ended');
    }
  };
Run Code Online (Sandbox Code Playgroud)