React Native UVC Camera
A React Native component to access to UVC web camera on non-rooted Android device, a combination of React Native Camera and UVCCamera .
UvcCameraManager is an example.
Installation (Android)
- Add
android/local.properties
,android-ndk
need justr14b
in NDK Archives, e.g.
sdk.dir=D\:\\proj\\tools\\android-sdk
ndk.dir=D\:\\proj\\tools\\android-ndk-r14b
- In
android/settings.gradle
...
include ':react-native-uvc-camera'
project(':react-native-uvc-camera').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-uvc-camera/android')
include ':usbCameraCommon'
project(':usbCameraCommon').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-uvc-camera/usbCameraCommon')
include ':libuvccamera'
project(':libuvccamera').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-uvc-camera/libuvccamera')
include ':react-native-camera'
project(':react-native-camera').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-camera/android')
- In
android/app/build.gradle
...
android {
...
defaultConfig {
...
minSdkVersion 18
...
}
...
}
...
repositories {
maven { url 'http://raw.github.com/saki4510t/libcommon/master/repository/' }
}
dependencies {
compile project(':react-native-uvc-camera')
compile ('com.facebook.react:react-native:0.51.0') { force = true }
...
}
- In
android/app/src/main/AndroidManifest.xml
...
<uses-permission android:name="android.permission.CAMERA" />
<uses-sdk
android:minSdkVersion="18"
To enable video recording
feature you have to add the following code:
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
- In
android/build.gradle
...
ext {
compileSdkVersion = 26
targetSdkVersion = 26
buildToolsVersion = "26.0.2"
googlePlayServicesVersion = "12.0.1"
supportLibVersion = "27.1.0"
versionBuildTool = "26.0.2"
versionCompiler = 26
versionTarget = 26
commonLibVersion = "1.5.20"
javaSourceCompatibility = JavaVersion.VERSION_1_7
javaTargetCompatibility = JavaVersion.VERSION_1_7
}
Usage
Take a look into this RNCamera doc.
UvcCamera Properties additional to RNCamera:
rotation
Values: 0, 90, 180, or 270.
Most USB cameras have different rotation by default. It adjusts your camera rotation by your own.
Customization
As said in android/src/main/java/org/reactnative/cameraview/CameraUvc.java
:
public void onStartPreview(){
// some USB camera will not return onPictureTaken and onVideoRecorded by uncomment some of bellow, test them by your own
// updateAutoFocus();
// updateFlash();
// updateFocusDepth();
// updateWhiteBalance();
// updateZoom();
}