简体   繁体   中英

Does Hammer.js requireFailure() work with multiple pointers on taps?

I'd like to have a gesture in js, where you can tap multiple times with two fingers and get a result that shows your action. It works perfectly fine if you set the attribute pointers to 1 (tap with 1 finger) or if you remove requireFailure().

You can test the code over here, tapping with two fingers works on your smartphone or an emulator: http://codepen.io/JanIngwer/pen/eNwOPO

  mc.add(new Hammer.Tap({ event: 'tripletap', taps: 3, interval: 800, posThreshold: 100, pointers: 2  }));
  mc.add(new Hammer.Tap({ event: 'doubletap', taps: 2, interval: 800, posThreshold: 100, pointers: 2  }));
  mc.add(new Hammer.Tap({ event: 'singletap',  interval: 800, posThreshold: 100, pointers: 2}));


   mc.get('tripletap').recognizeWith(['doubletap', 'singletap']);
   mc.get('doubletap').recognizeWith('singletap');

   mc.get('doubletap').requireFailure('tripletap');
   mc.get('singletap').requireFailure(['tripletap', 'doubletap']);

You just need to expand the tappable area and restrict to a single pointer. This allows a sigle double or triple executed my multiple fingers to work.

http://codepen.io/anon/pen/PPYvqo

mc.add(new Hammer.Tap({ event: 'ragetap', taps: 5, interval: 800, posThreshold: 1000, pointers: 1 }));
mc.add(new Hammer.Tap({ event: 'tripletap', taps: 3, interval: 800, posThreshold: 1000, pointers: 1  }));
mc.add(new Hammer.Tap({ event: 'doubletap', taps: 2, interval: 800, posThreshold: 1000, pointers: 1  }));
mc.add(new Hammer.Tap({ event: 'singletap',  interval: 800, posThreshold: 1000, pointers: 1}));

Expanding the recognized area also makes this work when requiring multiple pointers.

http://codepen.io/anon/pen/ZbzNbX

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM