You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在应用中检测鼠标滚轮滚动方向并获取滚动刻度数

鼠标滚轮方向识别与滚动次数获取实现方案

你所使用的PointerScrollEvent本身就内置了滚动方向、步长的量化信息,之前仅能获取指针位置,是因为没有读取其自带的scrollDelta属性。

  • 方向判断逻辑
    scrollDelta为Offset类型,两个分量分别对应横、纵向的滚动偏移:
    • 纵向(常规垂直滚轮):scrollDelta.dy 大于0代表向下滚动,小于0代表向上滚动
    • 横向(侧置滚轮、Shift+触发的横向滚动):scrollDelta.dx 大于0代表向右滚动,小于0代表向左滚动
  • 滚轮“咔哒”次数计算
    桌面端系统对每个物理滚轮咔哒的偏移量有固定默认值(通常垂直方向单步偏移为24逻辑像素,不同系统存在细微差异但单步偏移量统一)。直接用偏移量除以单步步长、取整,即可得到带方向的滚轮咔哒计数——正数代表对应方向滚动了N格,负数代表反方向滚动了N格。

示例代码:

Listener(
  onPointerScroll: (event) {
    // 读取纵向滚动偏移
    final double verticalDelta = event.scrollDelta.dy;
    // 系统默认单咔哒步长,可根据实际适配调整
    const double singleClickStep = 24.0;
    // 计算带方向的咔哒次数:正为向下,负为向上
    final int wheelCountWithDirection = (verticalDelta / singleClickStep).round();

    if (wheelCountWithDirection != 0) {
      // 在此处接入业务逻辑,例如 wheelCountWithDirection = 1 代表向下滚动1格,-2代表向上快速滚动2格
      print('带方向的滚轮滚动次数:$wheelCountWithDirection');
    }
  },
  child: // 你的业务页面组件
)

补充说明:

  • 如果需要支持触控板的平滑连续滚动,会接收到多个连续的微小偏移事件,此时可以通过时间窗口累计偏移量,累计值超过单步步长阈值时触发计数,即可还原物理滚轮的咔哒计数逻辑。
  • 整套实现不需要引入第三方依赖,仅通过原生Listener组件即可完成,可靠性与兼容性和系统底层事件保持一致。

内容的提问来源于stack exchange,提问作者Peter Toth

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.25 18:36:03