React Pressure
Run the app server
npm run start -server:port=2524 -server:context=public -disable:contexturl=true
Example Usage
<Pressure
handleTouchStart={this.handleTouchStart}
handleTouchMove={this.handleTouchMove}
handleTouchForceChange={this.handleTouchForceChange}
handleTouchEnd={this.handleTouchEnd}
>
{children}
</Pressure>
Props
-
children : React Element
required (React Element) -
handleTouchStart(evt, inital) : Function
handler function-
evt
will return touch start event -
inital {pageX: 0, pageY: 0, force: 0-1}
Position of the event
-
-
handleTouchMove(evt,inital,current) : Function
handler function-
evt
will return touch start event -
inital {pageX: 0, pageY: 0, force: 0-1}
Position of the starting point -
current {pageX: 0, pageY: 0, force: 0-1}
Current Position of the touch point
-
-
handleTouchForceChange(force) : Function
handler function-
force - (0-1)
Position of the event
-
-
handleTouchEnd(evt, current) : Function
handler function-
evt
will return touch start event -
current {pageX: 0, pageY: 0, force: 0-1}
Current Position of the touch point
-
-
handleSwipeLeft(inital, current) : Function
handler function-
inital {pageX: 0, pageY: 0, force: 0-1}
Position of the starting point -
current {pageX: 0, pageY: 0, force: 0-1}
Current Position of the touch point
-
-
handleSwipeRight(inital, current) : Function
handler function-
inital {pageX: 0, pageY: 0, force: 0-1}
Position of the starting point -
current {pageX: 0, pageY: 0, force: 0-1}
Current Position of the touch point
-
-
handleSwipeUp(inital, current) : Function
handler function-
inital {pageX: 0, pageY: 0, force: 0-1}
Position of the starting point -
current {pageX: 0, pageY: 0, force: 0-1}
Current Position of the touch point
-
-
handleSwipeDown(inital, current) : Function
handler function-
inital {pageX: 0, pageY: 0, force: 0-1}
Position of the starting point -
current {pageX: 0, pageY: 0, force: 0-1}
Current Position of the touch point
-
-
config : Object
travelled distance in pixel. default 50.-
swipeDistance : Number
travelled distance in pixel. default 50. -
longPressDuration : Number
This will be usefull whenontouchforcechange
is not supported browsers. default 50. -
preventClickTime : Number
To prevent click event time in millis. default 500. -
preventClickMaxForce : Number
To prevent click event by max force. default 0.5 preventDefault : boolean
-