Hammer.js:如何检测任意数量/多个手指的捏合

Hammer.js: How to detect pinch with any number of / multiple fingers

当我创建一个新的 Hammer Pinch 事件时,没有在选项中提到指针的数量,它最多只能检测到 3 个手指,如果我提到指针,例如

var multiPinch = new Hammer.Pinch({event: 'multipinch', pointers: 4, threshold: 0});

,那么它只检测 4 根手指的捏合。我曾尝试在文档和所有地方进行搜索,但无法在一个事件中检测到 2、3 甚至 10 个手指的捏合。我需要这个,因为我的网络应用程序必须在 81" 的大屏幕上运行。

PinchRecognizer 检查指针的数量是否与您指定的完全一致。 (这实际上是在超类AttrRecognizer中检查的)所以当你没有指定指针参数时检测到3个指针实际上是令人惊讶的,因为默认值为2.

无论如何,我看到了两个解决方案。一种是编写您自己的捏合识别器。看看 hammer.js 源代码并修改现有的代码,它实际上不到一屏那么长。 attrTest 函数正是您要找的。不要调用super方法(检查指针的个数),只检查指针的个数是否小于等于你想要的。

一个更简单的解决方案是为您想要的每个指针数量定义一个 PinchRecognizer。所以如果你想检测4个或更少的手指,这样做:

var mc = new Hammer.Manager(element);

mc.add(new Hammer.Pinch({ event: 'pinch2', pointers: 2, threshold: 0 }));
mc.add(new Hammer.Pinch({ event: 'pinch3', pointers: 3, threshold: 0 }));
mc.add(new Hammer.Pinch({ event: 'pinch4', pointers: 4, threshold: 0 }));

免责声明:我还没有测试过这个。您可能需要将 recognizeWith 调用到 link 所有识别器。

好吧我终于解决了!我不知道这是否是黑客攻击,但它确实有效! 最后的解决方案非常简单,就是将指针选项设置为 0,是零!

var multiPinch = new Hammer.Pinch({event: 'multipinch', pointers: 0, threshold: 0});

现在,这个 "multipinch" 事件检测到具有从 2 到 10 的任意数量的指针的夹点。

这是受此处文档的启发:http://hammerjs.github.io/recognizer-pinch/ 对于指针选项说:

| Option   | Default | Description                             |
|:--------:|---------|-----------------------------------------|
| pointers | 1       | Required pointers. 0 for all pointers.  |

因此,我尝试将捏合事件的指针选项设置为 0,结果成功了!