moaazsidat / react-native-qrcode-scanner

A QR code scanner component for React Native.
MIT License
2.04k stars 516 forks source link

Please provide flash function #117

Open Sam1141968878 opened 6 years ago

Sam1141968878 commented 6 years ago

happening: Please add the flash function, it is too dark at night.Thank!

Build details: "react-native": "0.55.3", "react-native-camera": "^1.1.4", "react-native-qrcode-scanner": "^1.0.1", 2018/7/5

alz10 commented 6 years ago

Here's a fix for that:

  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} //this is the only code you need to change
          style={[styles.camera, this.props.cameraStyle]}
          onBarCodeRead={this._handleBarCodeRead.bind(this)}
        >
          {this._renderCameraMarker()}
      </Camera>

if the above code doesn't makes sense to you, you can copy paste this code and replace the _renderCamera()

_renderCamera() {
    const { notAuthorizedView, pendingAuthorizationView, cameraType } = this.props
    const { isAuthorized, isAuthorizationChecked } = this.state
    if (isAuthorized) {
      if (this.props.fadeIn) {
        return (
          <Animated.View
            style={{
              opacity: this.state.fadeInOpacity,
              backgroundColor: 'transparent'
            }}>
            <Camera 
              style={[styles.camera, this.props.cameraStyle]} 
              onBarCodeRead={this._handleBarCodeRead.bind(this)}
              type={this.props.cameraType}
            >
              {this._renderCameraMarker()}
            </Camera>
          </Animated.View>
        )
      }
      return (
        <Camera
          type={cameraType}
          flashMode={this.props.flashMode}
          style={[styles.camera, this.props.cameraStyle]}
          onBarCodeRead={this._handleBarCodeRead.bind(this)}
        >
          {this._renderCameraMarker()}
        </Camera>
      )
    } else if (!isAuthorizationChecked) {
      return pendingAuthorizationView
    } else {
      return notAuthorizedView
    }
  }

===================================================================

  1. 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={RNCamera.Constants.FlashMode.torch}
     />

Check this documentation about Flash on how you're going to turn it off and on

Sam1141968878 commented 6 years ago

@Albert0405 Thank you. I'll try,It helps me a lot!

asantos00 commented 6 years ago

May I submit a PR with this change?

moaazsidat commented 6 years ago

@Albert0405 good stuff! @asantos00 That'd be awesome!

asantos00 commented 6 years ago

https://github.com/moaazsidat/react-native-qrcode-scanner/pull/112 already being done by someone here :)

kusPB commented 1 year ago

That's good