react-multitouch-gestures

this is an react gesture library that supports:

- tap
- hold
- rotate
- pinch
- drag with one finger
- drag with two fingers
- drag with three fingers

demo

How to use

``
function App() {
const component = useRef(null)


const onDrag = (pointer: IPointer) => {
console.log("dragging")
}

useGestures(component, {
onTapGesture: (pointer) => console.log(pointer.position.at(0)) //example how to print x position of tap
onDragGesture: onDrag,
// onPinchGesture: onPinch,
// onRotateGesture: onRotate,
// onDoubleDragGesture: onDoubleDrag,
// onTripleDragGesture: onTripleDrag,
// onHoldGesture: onHold
},
8, //distanceTreshold for hold gesture, the bigger number the further you can drag while holding
1000 // time in ms when the hold activates
)

return (

ref={component}
style={{ touchAction: 'none' }} //you need to disable default browser gestures
>

react-multitouch-gestures

);
}
`

how to run this repository

`
"clone this repository"
"uncomment lines in tsconfig.json"
npm i
npm run start

``