react-native-simple-camera
A sample project for React Native Camera.
How to use the Component in your app
To use the Camera Component in your app you need to do following steps.
Install dependencies
First, install the package
yarn add react-native-simple-camera
or the old npm style
npm i react-native-simple-camera --save
Secondly, link the package to your code base by running following command.
react-native link react-native-camera
If this does not work correctly. Please follow the manual installation steps: See the documentation
At least you need to add following missing parts manually.
android/app/src/main/AndroidManifest.xml
Add to beginning of the manifest.
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.kamera">
Add necessary permissions.
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />
android/build.gradle
Add maven urls to the end off your build.gradle file as follows.
allprojects {
repositories {
mavenLocal()
jcenter()
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
url "$rootDir/../node_modules/react-native/android"
}
maven {
url "https://maven.google.com"
}
maven { url "https://jitpack.io" }
}
}
Add Component to your app
You can use it as camera or barcode scanner.
Capturing photos
<CameraContainer
mode="photo"
onCapturePhoto={
(data) => console.log('Image captured!', data)
}
/>
onCapturePhoto function
When a photo is captured the onCapturePhoto
function provided as a property will be called. It will receive data
object as its parameter. data
contains information related to the image captured.
Scanning bar codes and QR codes
<CameraContainer
mode="scanner"
onBarCodeRead={
(barcode) => console.log('Barcode Found!', 'Type: ' + barcode.type + '\nData: ' + barcode.data)
}
/>
onBarCodeRead function
When the app reads a QR code the onBarCodeRead
function provided as a property will be called. It will receive barcode
object as its parameter. barcode
contains information related to the code captured. Returned data contains type of the code and data that it contained.
License
This project is licensed under the MIT License