1

In one of my project I am using RNCamera for capturing image. Also the camera screens have custom components. One of the component showing with camera is compass image. I need to merge the compass image with the captured image.

I have tried this library react-native-view-shot. Wrapping the RNCamera inside the view shot view. But the result contains only the captured image without compass.

I have also tried react-native-images-combine. Here the second image is always positioning at the left side of the first image.

I looking for a better solution. Can anyone suggest a way to fix this in react-native. It would be great. Thank you.

mmg
  • 11
  • 2

1 Answers1

0

Try to put both images in a View tag and each image in an own View tag. Than give “z-index” style property to put your image above. Let me know!

Andrea
  • 1
  • 1
  • Finally I found a solution for the above problem. I used libraries called **react-native-view-snapshot and react-native-photo-manipulator** (https://github.com/Jarred-Sumner/react-native-photo-manipulator). Since my second view is a custom view above camera (RNCamera) "z-index" didn't worked for me. react-native-view-snapshot is used to took the screenshot of second image and by using react-native-photo-manipulator merged the photo taken from camera and the screenshot image. – mmg Jul 23 '20 at 16:18