Pinch to zoom (SimpleOnScaleGestureListener) not working in react native app

20 views Asked by At

In a react native app I tried 2 camera libraries:

react-native-vision-camera and react-native-camera-kit.

They both have a property in the camera object to allow the native gesture to zoom. Respectively 'enableZoomGesture' (https://react-native-vision-camera.com/docs/guides/zooming) and 'zoomMode'.

When I pinch to zoom in my app nothing happens.

For the react-native-camera-kit I was able to figure out it makes use of the native SimpleOnScaleGestureListener function. I assume the react-native-vision-camera would rely on the same native function.

The 'onZoom' function in the react-native-camera-kit never gets called. My assumption is that this gesture is processed by another library and so it never arrives at the camera library.

I make use of react native navigation drawer which also relies on a gesture. But I'm not sure if this is the problem.

How could I get the zoom gesture to work?

This are the installed packages in my app:

  "dependencies": {
"@baronha/react-native-multiple-image-picker": "~1.1.6",
"@react-keycloak/native": "~0.6.4",
"@react-native-async-storage/async-storage": "~1.19.3",
"@react-native-camera-roll/camera-roll": "~6.0.0",
"@react-native-community/checkbox": "~0.5.16",
"@react-native-community/datetimepicker": "~7.6.1",
"@react-native-community/masked-view": "~0.1.11",
"@react-native-community/netinfo": "~11.2.0",
"@react-native-community/slider": "~4.4.3",
"@react-native-picker/picker": "~2.5.1",
"@react-navigation/drawer": "~6.6.6",
"@react-navigation/native": "~6.1.8",
"@react-navigation/native-stack": "~6.9.14",
"@react-navigation/stack": "~6.3.18",
"@reduxjs/toolkit": "~1.9.7",
"appcenter": "5.0.0",
"appcenter-analytics": "5.0.0",
"appcenter-crashes": "5.0.0",
"axios": "~1.5.1",
"base-64": "~1.0.0",
"core-js": "~3.33.3",
"https-proxy-agent": "^7.0.4",
"jwt-decode": "~4.0.0",
"moment": "~2.29.4",
"react": "18.2.0",
"react-native": "0.72.6",
"react-native-app-auth": "~7.1.0",
"react-native-camera-kit": "^13.0.0",
"react-native-check-box": "~2.1.7",
"react-native-code-push": "~8.1.0",
"react-native-device-info": "~10.11.0",
"react-native-dialog": "~9.3.0",
"react-native-dialog-input": "^1.0.8",
"react-native-fs": "~2.20.0",
"react-native-gesture-handler": "^2.15.0",
"react-native-inappbrowser-reborn": "~3.7.0",
"react-native-material-ripple": "~0.9.1",
"react-native-modal-datetime-picker": "~17.1.0",
"react-native-orientation-locker": "~1.5.0",
"react-native-reanimated": "~3.5.4",
"react-native-safe-area-context": "~4.7.2",
"react-native-screens": "~3.26.0",
"react-native-select-dropdown": "~3.4.0",
"react-native-splash-screen": "~3.3.0",
"react-native-svg": "~13.14.0",
"react-native-svg-transformer": "~1.1.0",
"react-native-toast-message": "~2.1.7",
"react-native-vector-icons": "~10.0.0",
"react-native-web": "~0.19.9",
"react-navigation": "~5.0.0",
"react-navigation-stack": "~2.10.4",
"react-redux": "~8.1.3",
"redux-persist": "~6.0.0"
0

There are 0 answers