I am working on a React Native app that scans barcodes. I want to enable the user the toggle the light on and off with the press of a button. Right now the light stays on at all times. Would this be possible with the React Native camera component? Thank You!
class CameraScreen extends React.Component {
state = {
isCameraReady: false
};
constructor(props) {
super(props);
this.handleCameraReady = this.handleCameraReady.bind(this);
this.state = {
camera: {
type: RNCamera.Constants.Type.back
}
};
}
handleCameraReady() {
this.setState({
isCameraReady: true
});
}
onBarCodeRead = data => {
this.setState({ scanned: true });
const DATA_SKU = data.data.split("*");
const SKU = DATA_SKU[0];
const STK_ID = DATA_SKU[1] !== undefined ? DATA_SKU[1] : "";
this.setState({ showCamera: false });
this.props.navigation.navigate("Home", {
scanDataSku: SKU,
scanDataStkID: STK_ID
});
};
render() {
return (
<SafeAreaView style={styles.container}>
<RNCamera
style={styles.container}
onBarCodeRead={this.onBarCodeRead}
ref={cam => (this.camera = cam)}
cameraProps={{ captureAudio: false }}
flashMode={
this.state.isCameraReady
? RNCamera.Constants.FlashMode.torch
: RNCamera.Constants.FlashMode.off
}
onCameraReady={this.handleCameraReady}
></RNCamera>
<View style={styles.bottomNav}>
<TouchableOpacity
onPress={() => this.props.navigation.navigate("Home")}
style={styles.bottomBtn}
>
<Text style={styles.bottomTxt}>Back</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.bottomBtn}>
<Text style={styles.bottomTxt}>Light</Text>
</TouchableOpacity>
</View>
</SafeAreaView>
);
}
}