15

I am trying to realize the same functionnality as in Facebook or Instagram:
Preview the image taken by the camera instantly

At this point, my taken is correctly taken when this function is called : 

takePicture = async function() {
   if (this.camera && this.state.isConnected === true) {
      const options = { quality: 0, base64: false };
      const data = await this.camera.takePictureAsync(options);
      this.toLoading(data.uri);
   }
};

As displayed here, camera quality option is set to 0 to assure that the issue isn't caused by image processing.

I also have set my RNCamera props to lower as so : 

      autoFocus={"off"}
      skipProcessing={true}
      type={"back"}
      flashMode={"off"}
      zoom={0}
      whiteBalance={"auto"}
      ratio={"16:9"}

I tested this on both android and ios and even if ios seems to execute this a little bit faster, it still doesn't do it instantly.
Has anyone been able to reproduce the facebook/instagram camera preview with react native? I have been looking on the github repo and there seem to be a lot of people in my situation but still no resolution. I have also noted that people have tried to eject expo projects to go on native code but the latency is still present.

Jaro
  • 1,587
  • 5
  • 20
  • 39

1 Answers1

6

There is now a skipProcessing flag which is meant to help the image display faster

this.camera.takePictureAsync({skipProcessing: true})

The documentation for SDK 30 says this may cause the image to be rotated incorrectly.

https://docs.expo.io/versions/latest/sdk/camera

ykay says Reinstate Monica
  • 4,634
  • 4
  • 32
  • 42
  • 4
    Skip processing should be set in the takepictureasync method as in my answer. You are setting it incorrectly on the camera.. If you can remove your downvote I would appreciate thanks. – ykay says Reinstate Monica Oct 31 '18 at 19:11