npm i --save nativescript-gesturehandler
- Version: 0.1.16
- GitHub:
- NPM: https://www.npmjs.com/package/nativescript-gesturehandler
- Downloads:
- Last Day: 0
- Last Week: 0
- Last Month: 0
Installation
tns plugin add nativescript-gesturehandler
Be sure to run a new build after adding plugins to avoid any issues.
This is a port of react-native-gesturehandler. The source is based on the source code by Krzysztof Magiera. Dont hesitate to go and thank him for his work!
API
First you need to install the plugin:
tns plugin add nativescript-gesturehandler
We need to do some wiring when your app starts, so open app.ts
and add this before creating any View/App/Frame:
TypeScript
import { install } from "nativescript-gesturehandler";
install();
You create a gesture handler using something like this:
import { GestureHandlerTouchEvent, GestureHandlerStateEvent, GestureStateEventData, GestureTouchEventData, HandlerType } from 'nativescript-gesturehandler';
function onGestureTouch(args: GestureTouchEventData) {
const { state, extraData, view } = args.data;
view.translateX = extraData.translationX;
view.translateY = extraData.translationY;
}
function onGestureState(args: GestureStateEventData) {
const { state, prevState, extraData, view } = args.data;
console.log('onGestureState', state, prevState, view, extraData);
}
const manager = Manager.getInstance();
const gestureHandler = = manager.createGestureHandler(HandlerType.PAN, 10, {
shouldCancelWhenOutside: false
});
gestureHandler.on(GestureHandlerTouchEvent, onGestureTouch, this);
gestureHandler.on(GestureHandlerStateEvent, onGestureState, this);
gestureHandler.attachToView(view);
Right now you must not forget to store the gestureHandler
somewhere or the gesture won't work on iOS (native object being released). This will be fixed in future versions.
Now about the API. All the gestures for the react counterpart exist with the same options and the same event extraData
.