PinchGestureHandler is not supported?

[Risbot]

Description

PinchGestureHandler is not supported?

Code

const Test: FunctionComponent = () => {
  const onGestureEvent = useAnimatedGestureHandler({
    onActive: () => {
      console.info('active');
    },
  });

  return (
    <PinchGestureHandler onGestureEvent={onGestureEvent}>
      <Animated.View >
      </Animated.View>
    </PinchGestureHandler>
  );
};

typescript error

No overload matches this call.
  Overload 1 of 2, '(props: Readonly<PinchGestureHandlerProperties>): PinchGestureHandler', gave the following error.
    Type 'OnGestureEvent' is not assignable to type '(event: PinchGestureHandlerGestureEvent) => void'.
      Types of parameters 'event' and 'event' are incompatible.
        Type 'PinchGestureHandlerGestureEvent' is not assignable to type 'PanGestureHandlerGestureEvent'.
          Types of property 'nativeEvent' are incompatible.
            Type 'GestureHandlerGestureEventNativeEvent & PinchGestureHandlerEventExtra' is not assignable to type 'NativeEvent'.
              Type 'GestureHandlerGestureEventNativeEvent & PinchGestureHandlerEventExtra' is missing the following properties from type 'PanGestureHandlerEventExtra': x, y, absoluteX, absoluteY, and 4 more.
  Overload 2 of 2, '(props: PinchGestureHandlerProperties, context?: any): PinchGestureHandler', gave the following error.
    Type 'OnGestureEvent' is not assignable to type '(event: PinchGestureHandlerGestureEvent) => void'.

Package versions

"react": "16.13.1",
"react-native": "0.63.2",
"react-native-gesture-handler": "1.7.0",
"react-native-reanimated": "2.0.0-alpha.5",

[terrysahaidak]

You should pass it as a generic parameter of useAnimatedGestureHandler. Here you can find an example https://www.github.com/terrysahaidak/reanimated-gallery/tree/master/src%2FImageTransformer.tsx

[Risbot]

But in example you use your custom useAnimatedGestureHandler and not default useAnimatedGestureHandler from library. It is not suported in library?

[terrysahaidak]

My custom one just has additional callbacks but shares the same typings so yes, it will work the same way.

[Risbot]

I am sorry but I do not understand it, in generic parameter of useAnimatedGestureHandler I can set only context type

  export function useAnimatedGestureHandler<TContext extends Context>(
      handlers: GestureHandlers<TContext>
    ): OnGestureEvent;

[terrysahaidak]

Sorry, you're right. You can use my version as a workaround for now, but that's something we should address for sure.

Will fix it later.

[terrysahaidak]

Hi @Risbot, just created PR which fixes it. Would be cool if you test it.

[Risbot]

Thank you. I will try it when i get any free time

[minhchienwikipedia]

@karol-bisztyga can you show me how to use PinchGestureHandler with react-native-reanimated 2? I don't know how to do it and I can't find any example!

[karol-bisztyga]

fwd @piaskowyk

[minhchienwikipedia]

@piaskowyk any update?