preface
When you encounter gestures at work, your first thought is to go to GitHub and find out if there is a good open source project or to implement one yourself. Anyway, I am looking for open source first, and only when there is no or bad use will I consider developing by myself. After all, work is about efficiency. Developing your own takes time and effort, and there are weird compatibility issues. In terms of gesture libraries, hammer.js and AlloyFinger are some of the best. Personally, I prefer AlloyFinger. After all, the call method is relatively simple and intuitive, but it also has some shortcomings. For example, double-finger zoom and double-finger rotation cannot be operated with the center of double finger as the origin, which gives me a strange feeling. That’s why I developed NonameGesture.
A simple introduction
The gesture library is primarily developed using PointerEvent pointer events. The table below shows the supported gestures. Code has been open source to GitHub, there is a need for partners.
Supporting gestures | introduce | The trigger condition |
---|---|---|
tap | Click on the event | Click time <500ms, and movement error <10 |
singleTap | Click the event, 250ms delay | Click time <500ms, and movement error <10 |
doubleTap | Double-clicking the event must trigger the tap twice | The distance between two clicks is less than 30 and the interval is less than 250ms |
longTap | Long press event | Hold time >=500ms |
drag | Drag and drop event | Drag and drop |
swipe | Sliding event | Moving distance within 200ms >=20 |
rotate | Two finger rotation event | Number of touch points =2 |
pinch | Double finger zoom event | Number of touch points =2 |
wheel | Mouse wheel zoom event | Scroll the mouse wheel |
Demo
Demo: nonamegesture. Codeman. Top
GitHub:github.com/18223781723…