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

问题描述 投票:1回答:2

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

我认为这是因为在捏手势期间,用户的手指会稍微摇动。

[有一种方法可以使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);
                });
javascript events hammer.js pan pinch
2个回答
0
投票

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

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

尝试在第一行之后添加,希望您会看到正在报告捏事件。

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


0
投票

如果只用一根手指平移,那么检查2根手指...

hammertime.on('panend', function(e) {
    if(e.maxPointers > 1) { return; }
})
© www.soinside.com 2019 - 2024. All rights reserved.