CODEWITHSUNDEEP
react-native
TIMEX
TIMEX

Reputation: 271634

In React Native, how can I only allow right direction panResponder?

class WrappedCell extends React.Component{
    translateX = new Animated.Value(0);
    _panResponder = PanResponder.create({
        onMoveShouldSetResponderCapture: () => true,
        onMoveShouldSetPanResponderCapture: () => true,
        onPanResponderMove: (e, gestureState) => { 
            Animated.event([null, {dx: this.translateX}])(e, gestureState)
        },
        onPanResponderTerminate: (e, gestureState) => {
            this._onReleased(e, gestureState);
        },
        onPanResponderRelease: (e, gestureState) => {
            this._onReleased(e, gestureState);
        },
    });

Right now, my pan responder allows both directions. How can I modify onPanResponderMove so that it only allows right direction?

Upvotes: 0

Views: 1168

Answers (1)

iuliu.net
iuliu.net

Reputation: 7145

Try something like this:

 onPanResponderMove: (e, gestureState) => {
     if(gestureState.dx > 0)
         Animated.event([null, {dx: this.translateX}])(e, gestureState)
 },

Upvotes: 2

Related Questions