如何在hammer.js中接收两个/一个手指和单击/双击的组合答案

【问题标题】：How can I receive combinations of two/one finger and single/double taps in hammer.js如何在hammer.js中接收两个/一个手指和单击/双击的组合
【发布时间】：2019-05-29 00:04:04
【问题描述】：

我正在尝试使用hammer.js 接收三种类型的点击事件

用一根手指点击
用一根手指双击
用两根手指双击

如何在hammer.js 中正确设置

这是我目前拥有的：

  if (mc == null) {
    mc = new Hammer.Manager(el);
  }
  mc.set({ touchAction: "none" });
  //mc.get("swipe").set({direction: Hammer.DIRECTION_ALL, pointers: 2});'
  //mc.get('tap').set({enable: false});
  var singletap = new Hammer.Tap({
    event: "singletap",
    taps: 1,
    pointers: 1
  });

  var doubletap = new Hammer.Tap({
    event: "doubletap",
    taps: 2,
    pointers: 1
  });
  var twodoubletap = new Hammer.Tap({
    event: "twodoubletap",
    taps: 2,
    pointers: 2
  });

  mc.add([twodoubletap, doubletap,singletap]);//, twotap, threetap]);

  twodoubletap.recognizeWith([doubletap,singletap])
  doubletap.recognizeWith([singletap,twodoubletap])

  //doubletap.requireFailure(twodoubletap);

  singletap.requireFailure([doubletap,twodoubletap]);

  mc.on("twodoubletap doubletap singletap", binding.value);

我可以让一个点击持续触发，有时一个手指双击。

两指双击要么不触发，要么立即与另一个轻击一起触发。

理想情况下，我希望每种类型的水龙头都能持续触发。

【问题讨论】：

标签： hammer.js

【解决方案1】：

我可以通过做三件事来实现它。 1.我为其他水龙头添加了dropRequireFailure到两指双击 2. 我在事件中设置了更大的阈值。 3. 我在事件处理程序中添加了一个基于时间的过滤器，它拒绝彼此太靠近的水龙头。我知道这并不理想，但现在可以。

          if (mc == null) {
            mc = new Hammer.Manager(el);
          }
          mc.set({ touchAction: "none" });
          //mc.get("swipe").set({direction: Hammer.DIRECTION_ALL, pointers: 2});'
          //mc.get('tap').set({enable: false});
          var singletap = new Hammer.Tap({
            event: "singletap",
            taps: 1,
            pointers: 1,
            interval: 500,
            threshold: 200,
            posThreshold: 200
          });

          var doubletap = new Hammer.Tap({
            event: "doubletap",
            taps: 2,
            pointers: 1,
            interval: 300,
            threshold: 200,
            posThreshold: 200
          });
          var twodoubletap = new Hammer.Tap({
            event: "twodoubletap",
            taps: 2,
            pointers: 2,
            interval: 400,
            threshold: 500,
            posThreshold: 200
          });

          mc.add([twodoubletap, doubletap,singletap]);//, twotap, threetap]);

          twodoubletap.recognizeWith([doubletap,singletap])
          doubletap.recognizeWith([twodoubletap])

          doubletap.requireFailure(twodoubletap);
          singletap.requireFailure([doubletap,twodoubletap]);
          twodoubletap.dropRequireFailure(doubletap);
          twodoubletap.dropRequireFailure(singletap);

          mc.on("twodoubletap doubletap singletap", handler);

然后在事件处理程序的顶部：

      let now = Date.now();
      if((now - lastTap)<500){
        return;
      }
      lastTap = now;

【讨论】：