1.0.6 • Published 9 years ago
react-native-qrscanner-kit v1.0.6
react-native-qrscanner-kit
增加扫描覆盖界面 ,扫描出结果后,不再继续解析二维码。通过调用shouldQR来再次开启继续解析二维码。
Getting started
.
Requirements
- JDK >= 1.7 (if you run on 1.6 you will get an error on "_cameras = new HashMap<>();")
- With iOS 10 and higher you need to add the "Privacy - Camera Usage Description" key to the info.plist of your project. This should be found in 'your_project/ios/your_project/Info.plist'. Add the following code:
<key>NSCameraUsageDescription</key>
<string>Your message to user when the camera is accesseded for the first time</string>
<!-- Include this only if you are planning to use the camera roll -->
<key>NSPhotoLibraryUsageDescription</key>
<string>Your message to user when the photo library is accessed for the first time</string>
<!-- Include this only if you are planning to use the microphone for video recording -->
<key>NSMicrophoneUsageDescription</key>
<string>Your message to user when the microsphone is accessed for the first time</string>Mostly automatic install with react-native
npm install react-native-camera@https://github.com/chinaczy/react-native-camera.git --savenpm install react-native-qrscanner-kitreact-native link react-native-camera
Manual install
iOS
npm install react-native-camera@https://github.com/lwansbrough/react-native-camera.git --save- In XCode, in the project navigator, right click
Libraries➜Add Files to [your project's name] - Go to
node_modules➜react-native-cameraand addRCTCamera.xcodeproj - In XCode, in the project navigator, select your project. Add
libRCTCamera.ato your project'sBuild Phases➜Link Binary With Libraries - Click
RCTCamera.xcodeprojin the project navigator and go theBuild Settingstab. Make sure 'All' is toggled on (instead of 'Basic'). In theSearch Pathssection, look forHeader Search Pathsand make sure it contains both$(SRCROOT)/../../react-native/Reactand$(SRCROOT)/../../../React- mark both asrecursive. - Run your project (
Cmd+R)
Android
npm install react-native-camera@https://github.com/lwansbrough/react-native-camera.git --save- Open up `android/app/src/main/java/.../MainApplication.java
- Add
import com.lwansbrough.RCTCamera.RCTCameraPackage;to the imports at the top of the file - Add
new RCTCameraPackage()to the list returned by thegetPackages()method. Add a comma to the previous item if there's already something there.
Append the following lines to
android/settings.gradle:include ':react-native-camera' project(':react-native-camera').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-camera/android')Insert the following lines inside the dependencies block in
android/app/build.gradle:compile project(':react-native-camera')
Usage
import Scan from 'react-native-qrscanner-kit' ;
...
scanResult(data , callback){
Alert.alert( "qrcode result " , data.data , [{text:"ok" , onPress:()=>callback()}],{cancelable:false}) ;
}
render() {
return (
<View style={{flex:1 }}>
<Scan
onBarCodeRead={this.scanResult.bind(this)}
/>
</View>
);
}
}