Pinch to zoom gesture not working on Android when used inside or outside ScrollView

[codebin-pune]

I tried all the solution given here but still not working.

[vemarav]

provide react, react-native, and react-native-gesture-handler versions.

the example repo has scrollview and it's working.

[codebin-pune]

"react": "17.0.2", "react-native": "0.66.3", "react-native-gesture-handler": "1.10.3"

[codebin-pune]

@vemarav, Its working fine in example but not working in my app.

[nitin41]

I found a pretty good solution for this thing. Have a look guys,

The main issue was that the gesture was not working in android devices, because in android it is required to wrap our component inside "gestureHandlerRootHOC" from this library react-native-gesture-handler.

Take a look at the following code:

import { gestureHandlerRootHOC } from 'react-native-gesture-handler';
const ExampleWithHoc = gestureHandlerRootHOC(() => {
return (
<Crop
      source={props.uri}
      cropShape={"circle"} // rect || circle
      width={SCREEN_WIDTH} // default value
      height={SCREEN_WIDTH} // defalt value
      cropArea={{
        width: SCREEN_WIDTH / 1.3, // required
        height: SCREEN_WIDTH / 1.3, // required
      }}
      borderWidth={0} // default 2
      backgroundColor={"#FFFFFF"} // default #FFFFFF, use same format
      opacity={0.7} // between 0 and 1, default is 1
      maxZoom={3} // default 3
      resizeMode={"contain"} // default "cover"
      onCrop={(cropCallback) => (crop = cropCallback)} // returns a function
    />
)
});

https://docs.swmansion.com/react-native-gesture-handler/docs/#android

Hope it helps! Happy Coding.