How to use the react-native-gesture-handler.State.END function in react-native-gesture-handler

To help you get started, we’ve selected a few react-native-gesture-handler examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github berty / berty / js / packages / components / chat / record / RecordComponent.tsx View on Github external
} else {
							try {
								;(recorder.current as any)?.on('meter', addMeteredValue)
							} catch (e) {
								console.warn(['err' + e])
							}
							setRecordingState(RecordingState.RECORDING)
						}
					})
				}

				return
			}

			// Released
			if (e.nativeEvent.state === State.END) {
				if (recordingState === RecordingState.RECORDING) {
					setRecordingState(RecordingState.COMPLETE)
				}

				return
			}

			if (e.nativeEvent.state === State.CANCELLED || e.nativeEvent.state === State.FAILED) {
				setRecordingState(RecordingState.PENDING_CANCEL)
				return
			}
		},
		[
github bolan9999 / react-native-spring-scrollview / spring-scrollview / SpringScrollView.js View on Github external
_onHandlerStateChange = ({ nativeEvent: event }) => {
    // console.log("event", event);
    switch (event.state) {
      case State.BEGAN:
        this._slowDownAnimation && this._slowDownAnimation.stop();
        this._slowDownAnimation = null;
        this._transformY.extractOffset();
        break;
      case State.CANCELLED:
      case State.FAILED:
      case State.END:
        this._transformY.flattenOffset();
        this._slowDownAnimation = Animated.sequence([
          Animated.decay(this._transformY, {
            velocity: event.velocityY / 1000,
            deceleration: 0.95,
            useNativeDriver: true
          }),
          Animated.timing(this._transformY, {
            toValue: 0,
            duration: 300,
            easing: Easing.sin,
            useNativeDriver: true
          })
        ]);
          this._slowDownAnimation.start();
    }
github wcandillon / can-it-be-done-in-react-native / tinder-swiping / components / Profiles.js View on Github external
} = this;
    gestureState.setValue(State.UNDETERMINED);
    translationX.setValue(0);
    translationY.setValue(0);
    velocityX.setValue(0);

    const finalTranslateX = add(translationX, multiply(0.2, velocityX));
    const translationThreshold = width / 2;
    const snapPoint = cond(
      lessThan(finalTranslateX, -translationThreshold),
      -rotatedWidth,
      cond(greaterThan(finalTranslateX, translationThreshold), rotatedWidth, 0),
    );
    // TODO: handle case where the user drags the card again before the spring animation finished
    this.translateY = cond(
      eq(gestureState, State.END),
      [
        set(translationY, runSpring(clockY, translationY, 0)),
        translationY,
      ],
      translationY,
    );
    this.translateX = cond(
      eq(gestureState, State.END),
      [
        set(translationX, runSpring(clockX, translationX, snapPoint)),
        cond(and(eq(clockRunning(clockX), 0), neq(translationX, 0)), [
          call([translationX], this.swipped),
        ]),
      ],
      translationX,
    );
github iyegoroff / react-native-reanimated-color-picker / src / ValueSlider.tsx View on Github external
componentDidMount() {
    const { width, height, value } = this.state

    if (width !== undefined && height !== undefined && value !== undefined) {
      this.props.onValueInit(value, new Animated.Value(GestureState.END))
    }
  }
github Tosuke / submarine / src / components / molecules / ImageModal.tsx View on Github external
),
              set(
                focusImageY,
                first(
                  ranged(divide(sub(focalY, boxHeight / 2, y), scale), -height / 2, height / 2),
                  eq(state, State.ACTIVE),
                ),
              ),
              cond(and(eq(state, State.ACTIVE), greaterThan(scale, 1)), [
                set(pinchX, sub(sub(focalX, boxWidth / 2), add(multiply(focusImageX, scale), panX))),
                set(pinchY, sub(sub(focalY, boxHeight / 2), add(multiply(focusImageY, scale), panY))),
              ]),
              call([scale], ([scale]) => {
                setPanHandlerIsEnabled(scale > 1)
              }),
              cond(eq(state, State.END), [cond(lessOrEq(scale, 1), reset)]),
            ])
          },
        },
github wcandillon / can-it-be-done-in-react-native / season2 / spotify-player / components / AnimatedHelpers / Gestures.ts View on Github external
finished: new Value(0),
    velocity: new Value(0),
    position: new Value(0),
    time: new Value(0)
  };

  const isDecayInterrupted = and(eq(state, State.BEGAN), clockRunning(clock));
  const finishDecay = [set(offset, decayState.position), stopClock(clock)];

  return block([
    cond(isDecayInterrupted, finishDecay),
    cond(neq(state, State.END), [
      set(decayState.finished, 0),
      set(decayState.position, add(offset, value))
    ]),
    cond(eq(state, State.END), [
      cond(and(not(clockRunning(clock)), not(decayState.finished)), [
        set(decayState.velocity, velocity),
        set(decayState.time, 0),
        startClock(clock)
      ]),
      reDecay(clock, decayState, { deceleration }),
      cond(decayState.finished, finishDecay)
    ]),
    decayState.position
  ]);
};
github computerjazz / react-native-draggable-flatlist / procs.tsx View on Github external
hoverTo,
  touchCellOffset,
  onGestureRelease,
  touchOffset,
) => block([
  cond(and(
    neq(state, tapState),
    not(disabled),
  ), [
    set(tapState, state),
    cond(eq(state, GestureState.BEGAN), [
      set(hasMoved, 0),
      set(hoverTo, sub(offset, scrollOffset)),
      set(touchCellOffset, touchOffset),
    ]),
    cond(eq(state, GestureState.END), onGestureRelease)
  ]
  )
]))
github react-navigation / stack / src / views / Stack / Card.tsx View on Github external
this.props.onOpen(false);
            } else {
              this.props.onClose(false);
            }
          })
        ),
        stopClock(this.clock),
      ],
      [
        set(
          this.isSwipeCancelled,
          eq(this.gestureState, GestureState.CANCELLED)
        ),
        cond(
          and(
            eq(this.gestureState, GestureState.END),
            lessThan(this.velocity, 0)
          ),
          [set(this.velocity, 0), set(this.velocityUntraversed, 0)]
        ),
        set(this.isSwiping, FALSE_NODE),
        this.runTransition(
          cond(
            greaterThan(
              abs(this.extrapolatedPosition),
              divide(this.distance, 2)
            ),
            cond(
              lessThan(
                cond(
                  eq(this.velocity, FALSE_NODE),
                  this.gesture,
github wcandillon / can-it-be-done-in-react-native / snapchat-discovery / components / StoryModal.js View on Github external
() => block(
            [
              cond(eq(this.state, State.UNDETERMINED), runSpring(this.translateX, 0)),
              cond(eq(this.state, State.UNDETERMINED), runSpring(this.translateY, 0)),
              cond(eq(this.state, State.UNDETERMINED), runSpring(this.width, wWidth)),
              cond(eq(this.state, State.UNDETERMINED), runSpring(this.height, wHeight)),
              cond(and(eq(this.state, State.END), lessOrEq(this.velocityY, 0)), [
                runSpring(this.translateX, 0),
                runSpring(this.translateY, 0),
                runSpring(this.width, wWidth),
                runSpring(this.height, wHeight),
              ]),
              cond(and(eq(this.state, State.END), greaterThan(this.velocityY, 0)), [
                runSpring(this.translateX, position.x),
                runSpring(this.translateY, position.y),
                runSpring(this.width, position.width),
                runSpring(this.height, position.height),
                cond(eq(this.height, position.height), call([], onRequestClose)),
              ]),
              cond(eq(this.state, State.ACTIVE), set(this.width, interpolate(this.translateY, {
                inputRange: [wHeight / 4, wHeight - position.height],
                outputRange: [wWidth, position.width],
              }))),
github wix / react-native-ui-lib / src / incubator / TabController / index.js View on Github external
..._.map(itemStates, (state, index) => {
                  return [
                    cond(and(eq(state, State.BEGAN), !_.includes(ignoredItems, index)), set(this._targetPage, index)),
                    cond(
                      and(eq(this._targetPage, index), eq(state, State.END), !_.includes(ignoredItems, index)),
                      set(this._currentPage, index),
                    ),
                  ];
                }),
              ])