Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Delay on the capture of an image - React Native Camera / Expo Camera

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.

like image 323
Aria Groult Avatar asked May 18 '18 07:05

Aria Groult


People also ask

Does react native Camera work with Expo?

To access camera in react native you need to import the expo-camera SDK, and Camera permissions from expo-permissions.

How do you save a photo from Camera expo?

import { CameraRoll } from 'react-native'; ... ... await CameraRoll. saveToCameraRoll(photo. uri);


1 Answers

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

like image 115
ykay says Reinstate Monica Avatar answered Sep 18 '22 14:09

ykay says Reinstate Monica