skip to Main Content

I have a simple react native App (Android) and am trying to take a photo with flash turned on.
It works perfectly fine if flash is set to ‘off’, however, when I set it to ‘on’ the flash light turns on, but no photo is beeing taken, because it always times out:

Error taking photo: [capture/timed-out: [capture/timed-out] The image capture was aborted because it timed out.]

I am using react-native-vision-camera. It neither works on my physical device nor on an emulated device.

I just can’t figure out what the problem is.

Here is the code:


import React, {useRef} from 'react';
import { View, Button } from 'react-native';

import {Camera, useCameraDevice, useCameraPermission, useCameraFormat} from 'react-native-vision-camera';


function CameraScreen(){
    const camera = useRef(null);
    const device = useCameraDevice('back');

    // Handle requesting permissions ...

    const takePhoto = async () => {
        let noCameraAvailable = !camera.current;
        if (noCameraAvailable) {
            console.log("No camera available");
            return;
        }
        try {
            const photo = await camera.current.takePhoto({
                // Flash turns on but no photo is taken due to timeout, 
                // if off however it works
                flash: 'on', 
            });
            console.log("Photo: ", photo);
        } catch (error) {
            console.error("Error taking photo: ", error);
        }
    }

    return (
        <View style={styles.cameraLayoutContainer}>
            <Camera
            style={styles.childrenContainer}
                device={device}
                isActive={true}
                ref={camera}
                photo={true}
            />
            <Button title="Take photo" onPress={takePhoto} />
        </View>
        
    );
}

const styles = {
    cameraLayoutContainer: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    },
    childrenContainer: {
        position: 'absolute',
        width: '100%',
        height: '100%',
    },
}

export default CameraScreen;

2

Answers


  1. Please include a hasFlash check before attempting to take a photo

    import React, { useRef } from 'react';
    import { View, Button, Platform } from 'react-native';
    
    import { Camera, useCameraDevice, useCameraPermission, useCameraFormat } from 'react-native-vision-camera';
    
    function CameraScreen() {
        const camera = useRef(null);
        const device = useCameraDevice('back');
        const hasFlash = device?.hasFlash;
    
        // Handle requesting permissions ...
    
        const takePhoto = async () => {
            let noCameraAvailable = !camera.current;
            if (noCameraAvailable) {
                console.log("No camera available");
                return;
            }
            try {
                const photo = await camera.current.takePhoto({
                    // Check if flash is available before turning it on
                    flash: hasFlash ? 'on' : 'off',
                });
                console.log("Photo: ", photo);
            } catch (error) {
                console.error("Error taking photo: ", error);
            }
        }
    
        return (
            <View style={styles.cameraLayoutContainer}>
                <Camera
                    style={styles.childrenContainer}
                    device={device}
                    isActive={true}
                    ref={camera}
                    photo={true}
                />
                <Button title="Take photo" onPress={takePhoto} />
            </View>
    
        );
    }
    
    const styles = {
        cameraLayoutContainer: {
            flex: 1,
            justifyContent: 'center',
            alignItems: 'center',
        },
        childrenContainer: {
            position: 'absolute',
            width: '100%',
            height: '100%',
        },
    }
    
    export default CameraScreen;
    
    Login or Signup to reply.
  2. There is an issue with some android devices see this Github issue: Error on taking picture – Precapture timed out after 5 seconds

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search