hammer.js - hammerJs - 滑动和拖动之间的区别

Question

如何区分同一元素上的滑动和拖动？我试过:

Hammer(blueDiv).on('swipe', function(e) {
   e.gesture.stopDetect();
   e.gesture.preventDefault();
   alert('swipe');
});

Hammer(blueDiv).on('drag', function(e) {
   alert('drag');
});

( http://jsfiddle.net/crEEN/ )

但是在滑动时，我只会收到拖动提示，而不是滑动提示。我需要的只是用于快速滑动的滑动事件，以及用于更长拖动的拖动事件

有什么帮助吗？

Answer 1

我面临着同样的挑战，需要以某种方式区分滑动和拖动事件。我所看到的，主要标准是移动的所谓 velocity，它在 Hammer options 中的选项中设置为 swipe_velocity .

我尝试在 Chrome 中使用默认的 swipe_velocity，并注意到如果你像滑动一样移动，即触摸 => 快速拖动 => 释放，然后它会注册事件作为所有标准触摸、拖动、释放之外的滑动。所以我建议先捕获 swipe，然后在需要时捕获其余事件。

这是 Hammer 中负责计算速度的函数，这让事情变得更清楚了:

  /**
   * calculate the velocity between two points
   * @param   {Number}    delta_time
   * @param   {Number}    delta_x
   * @param   {Number}    delta_y
   * @returns {Object}    velocity
   */
  getVelocity: function getVelocity(delta_time, delta_x, delta_y) {
    return {
      x: Math.abs(delta_x / delta_time) || 0,
      y: Math.abs(delta_y / delta_time) || 0
    };
  },