Turn flashlight on/off In QRcodeScanner React native - Alternative Solution

Question

Turn flashlight on/off In QRcodeScanner React native

I have follow the tutorial above, but still not working. It doesn't turn on the flash on pressing the touch opacity.

The issue is the same as the problem send, but the solution for him not work for me, don't know why.

UPDATE I have found a solution, if the other post not work for you, you should try this step by step. Probably it will merged in a future PR in react-native-qrcode-scanner, but for now this should solve.

import QRCodeScanner from "react-native-qrcode-scanner";
import { RNCamera } from "react-native-camera"

Props on QRCodeScanner:

cameraStyle={{ height: SCREEN_HEIGHT }}
cameraProps{{ flashMode: this.state.isFlashOn ? RNCamera.Constants.FlashMode.torch : RNCamera.Constants.FlashMode.off, captureAudio: false }}
customerMarker={this.renderCustomMarker} />

The Button:

<TouchOpacity activeOpacity={1} onPress={() => {
       this.setState({isFlashOn: !this.state.isFlashOn});
       this.scanner.reactivate();
    }}>

Answer 1

The solution to me was in: https://github.com/moaazsidat/react-native-qrcode-scanner/issues/117

Thanks to @Albert0405!

Here is the fix from @Albert0405 for my problem:

1) Go to node_modules and find react-native-qrcode-scanner folder and open index.js

2) find _renderCamera() and then on the Camera component, change this

<Camera
   type={cameraType}
   flashMode={this.props.flashMode} // Just add this line
   style={[styles.camera, this.props.cameraStyle]}
   onBarCodeRead={this._handleBarCodeRead.bind(this)}
>
    {this._renderCameraMarker()}
</Camera>

3) Last step is to you use the Flash on your project

import QRCodeScanner from "react-native-qrcode-scanner";
import { RNCamera } from "react-native-camera";

<QRCodeScanner
    flashMode={this.state.isFlashOn ? RNCamera.Constants.FlashMode.torch : RNCamera.Constants.FlashMode.off}
/>

The cameraProps does not work for me. So I replaced it with the code flashMode above.

RNCamera.Constants.FlashMode.torch - Turn on Flashlight RNCamera.Constants.FlashMode.off - Turn off Flashlight flashMode is a field to set Flash on RNCamera

What this step by step does is enable flashMode to be set from react-native-qrcode-scanner.

Reference: https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md

UPDATE: react-native-qrcode-scanner version 1.2.2+ has this change implemented. My PR was merged and available to all users, to see how to use please read the Read Me for git repo.