Pinch 事件触发 Hammer.js 中的 pan 事件

Question

我正在使用 Hammer.js 库编写一个小型移动手势识别器。 不幸的是，似乎当用户捏合或捏出时，Hammer,js 也会触发一些平移事件。

我认为这是因为在捏合手势期间，用户的手指做了一点平移运动。

有一种方法可以让 Hammer.js 在紧要关头忽略小平移运动吗？

老实说，Hammer.js 文档对此并不清楚。

这是我的代码：

                    hammer = new Hammer.Manager(myelement);
                var singleTap = new Hammer.Tap({
                    event: 'tap',
                });

                var doubleTap = new Hammer.Tap({
                    event: 'doubletap',
                    taps: 2
                });

                // SWIPE RECOGNIZERS

                var swipeLeft = new Hammer.Swipe({
                    event: 'swipeleft',
                    direction: 2
                });

                var swipeRight = new Hammer.Swipe({
                    event: 'swiperight',
                    direction: 4
                });

                var swipeUp = new Hammer.Swipe({
                    event: 'swipeup',
                    direction: 8
                });

                var swipeDown = new Hammer.Swipe({
                    event: 'swipedown',
                    direction: 16
                });


                // PINCH RECOGNIZERS
                var pinch = new Hammer.Pinch({
                    event: 'pinch',
                    pointers: 2
                });

                var pinchIn = new Hammer.Pinch({
                    event: 'pinchin',
                    pointers: 2,
                });

                var pinchOut = new Hammer.Pinch({
                    event: 'pinchout',
                    pointers: 2,
                });

                // PRESS RECOGNIZER
                var press = new Hammer.Press({
                    event: 'press',
                    pointers: 1,
                    threshold: 5,
                    time: 500
                });

                // PAN RECOGNIZER
                var pan = new Hammer.Pan({
                    event: 'pan',
                    pointers: 0
                });

                // ROTATE EVENTS RECOGNIZERS

                var rotateStart = new Hammer.Rotate({
                    event: 'rotatestart',
                    pointers: 2,
                    threshold: 0
                });

                var rotateEnd = new Hammer.Rotate({
                    event: 'rotateennd',
                    pointers: 2,
                    threshold: 0
                });

                var rotateCancel = new Hammer.Rotate({
                    event: 'rotatecancel',
                    pointers: 2,
                    threshold: 0
                });

                // ADDING RECOGNIZERS TO HAMMER 
                hammer.add([doubleTap, singleTap]);

                hammer.add([swipeDown, swipeUp, swipeRight, swipeLeft]);

                hammer.add([pan]);

                hammer.add([pinch]);
                hammer.add([press]);

                hammer.add([rotateStart, rotateEnd, rotateCancel]);

                pinchIn.recognizeWith([pan]);
                pinchOut.recognizeWith([pan]);
                pan.requireFailure([pinchIn, pinchOut]);

                // BEHAVIOUR ON TAP
                doubleTap.recognizeWith(singleTap);

                // DOUBLE/TRIPLE TAP RECOGNIZERS EXCLUSION
                singleTap.requireFailure([doubleTap]);

                //Binding Hammer's events with hammerHandler
                hammer.on("tap doubletap press rotatestart rotateend rotatecancel swipeleft swiperight swipeup swipedown pan pinch", function (event) {
                    hammerHandler(event);
                });

Answer 1

我只是在处理同样的问题，事实证明默认情况下会禁用捏合。您必须像这样启用它：

hammer.get('pinch').set({enable:true});

尝试在您的第一行之后添加它，希望您应该看到正在报告的捏事件。

来源：http://hammerjs.github.io/getting-started/

Answer 2

如果您只使用一根手指进行平移，那么请检查两根手指...

hammertime.on('panend', function(e) {
    if(e.maxPointers > 1) { return; }
})