diff --git a/README.md b/README.md index 86f285f5..1cac9292 100644 --- a/README.md +++ b/README.md @@ -414,6 +414,59 @@ return ( ); ``` +### `panGestureHandler()` + +```tsx +const { + gestureEvent, + state + translationX, + velocityX, + translationY, + velocityY +} = panGestureHandler(); +return ( + +); +``` + +### `horizontalPanGestureHandler()` + +```tsx +const { + gestureEvent, + state + translationX, + velocityX, +} = horizontalPanGestureHandler(); +return ( + +); +``` + +### `verticalPanGestureHandler()` + +```tsx +const { + gestureEvent, + state + translationY, + velocityY, +} = verticalPanGestureHandler(); +return ( + +); +``` + +### `panGestureHandler()` + +```tsx +const {gestureEvent, translationX, translationY} = panGestureHandler(); +return ( + +); +``` + ### `withSpring({ value: Node, velocity: Node, state: Value, offset: Node, config, snapPoints: Node[], onSnap: (value) => void }): Node` Decorates animated value to spring when the gesture ends. diff --git a/src/Gesture.ts b/src/Gesture.ts index 3113df83..87ff5448 100644 --- a/src/Gesture.ts +++ b/src/Gesture.ts @@ -11,7 +11,6 @@ import { FlingGestureHandlerEventExtra } from "react-native-gesture-handler"; -import { clamp } from "./Math"; import { snapPoint } from "./Animations"; const { @@ -174,13 +173,6 @@ export const withDecay = (config: WithDecayParams) => { ]); }; -export const withClamp = ( - value: Animated.Node, - state: Animated.Value, - min: Animated.Adaptable, - max: Animated.Adaptable -) => cond(eq(state, State.ACTIVE), clamp(value, min, max), value); - export const preserveMultiplicativeOffset = ( value: Animated.Adaptable, state: Animated.Adaptable @@ -234,3 +226,58 @@ export const onGestureEvent = ( onGestureEvent: gestureEvent }; }; + +export const panGestureHandler = () => { + const translationX = new Value(0); + const velocityX = new Value(0); + const translationY = new Value(0); + const velocityY = new Value(0); + const state = new Value(State.UNDETERMINED); + const gestureHandler = onGestureEvent({ + translationX, + velocityX, + state + }); + return { + translationX, + velocityX, + translationY, + velocityY, + state, + gestureHandler + }; +}; + +export const horizontalPanGestureHandler = () => { + const translationX = new Value(0); + const velocityX = new Value(0); + const state = new Value(State.UNDETERMINED); + const gestureHandler = onGestureEvent({ + translationX, + velocityX, + state + }); + return { + translationX, + state, + velocityX, + gestureHandler + }; +}; + +export const verticalPanGestureHandler = () => { + const translationY = new Value(0); + const velocityY = new Value(0); + const state = new Value(State.UNDETERMINED); + const gestureHandler = onGestureEvent({ + translationY, + velocityY, + state + }); + return { + translationY, + state, + velocityY, + gestureHandler + }; +};