0

I'm using react-native-camera library in my React Native project.

But I have a problem when I try to take the photo. It takes 3-4 seconds before the photo is saved. When I click on the button to take the photo I hear sound but then it takes about 3-4 seconds to save the photo.

The render method is as follows:

return (
   <View style={styles.container}>
       <Camera ref={(cam) => {this.camera = cam;}}
               style={styles.preview}
               aspect={Camera.constants.Aspect.fill}>
                    {this.imageOverlay()}
                    <Text style={styles.capture} onPress={this.takePicture.bind(this, this.state.type)}>[CAPTURE]</Text>
       </Camera>
    </View>
)

And takePicture function is as follows:

takePicture(type){
        let self = this;
        this.camera.capture({target: Camera.constants.CaptureTarget.disk})
            .then((data) => {

                <!---------------------------------------------------------->
                <!------------It takes 3-4 seconds to come here------------!>
                <!---------------------------------------------------------->

                let n_pictures = [];
                each(this.state.pictures, function (picture){
                   if(picture.item !== type.item){
                       n_pictures.push(picture)
                   }else{
                       n_pictures.push({
                           title: type.title,
                           noImage: false,
                           imageOverlay: type.imageOverlay,
                           image: data.path,
                           imageIcon: type.imageIcon,
                           overlay: false,
                           item: type.item,
                           mandatory: type.mandatory
                       })
                   }
                });
                self.setState({pictures: n_pictures, showCamera: false})
            })
            .catch(err => console.error(err));
    }

Any idea how to solve it?

Can I at least put an loading screen until the photo is saved?

Boky
  • 11,554
  • 28
  • 93
  • 163

1 Answers1

0

So I had this same issue, and after a while of searching on the internet I could not find an answer to speed it up.

However, to answer your query about using a loading screen you may want to look into Javascript promises. For my app, I redirected the user immediately to a new screen and showed a loading picture while the promise was not resolved/rejected. Once it was resolved, the picture showed.

I know this is an old answer, but I'm going to put this here for anyone else who may have a similar issue.