How can I make my react-native-camera capture fast?

Question

  takePicture = async function() {
    if (this.camera) {
       const options = { quality: 0.5, base64: true,  }; 
       const data = await this.camera.takePictureAsync(options);         
        this.setState({path: data.uri})
    }   
  }

As soon as I call my takePicture fuction to capture image, the camera still keeps moving and doesn't pause. I want the camera to pause and then show me the image.

Is there something here to with handling Promise? If yes, I don't know where to do it and how.

I've also tried using pauseAfterCapture:true but it still takes 1 or 2 second to capture the image.

I know this is an old issue but no solution could help me yet. Please help.

score 0 · Answer 1 · answered Mar 09 '20 at 11:26

I've also found the available camera components very slow, that is why I created react-native-fast-camera and I just open sourced it for the public use. It is very customizable and completely controllable by react native components.

Note: Currently the Android version is still work in progress.

Here is an example:

import FastCamera, { Methods } from 'react-native-fast-camera';


<FastCamera style={{ height: cameraHeight, width: cameraWidth }}
    onSaveSuccess={imageUrl => {
      console.log("onSaveSuccess: ", imageUrl);
    }}
    onGalleryImage={imageUrl => {
      console.log("onGalleryImage: ", imageUrl);
    }}
    onFlashToggle={isflashOn => {
      console.log('flash info: ', isflashOn);
    }}
  >
    {/* here render your buttons to control the camera component */}
    <Button 
      title="capture picture"
      onPress={()=> Methods.takePicture();}
    />
  </FastCamera>

And here is a screenshot:

How can I make my react-native-camera capture fast?

1 Answers1