π₯ New version with new features @3.1.0!
Do you ever want to detect and recognize faces? this is now possible especially in react native, This lib aims to provide best detection and recognition results as well as facial landmarks.
- New to Face Recognition? We recommend you start with the default values which described below.
- Looking to contribute? feel free to join our community on Slack, and take a look into coming updates.
- If the library doesn't work with you, you need to check your mobile's CPU if it one of those:
x86 CPUDownload this package Click herex86_64 CPUDownload this package Click herearm64-v8a CPUDownload this package Click here
After downloading you need to put that package into this location react-native-facerecognition/android/app/src/main/jniLibs and that's all!
β οΈ Since we're focusing our efforts on next updates, we are really welcome for any issues/pulls to improve the way we go.
- Face Detection
- Face Recognition (LBPH Algorithm only)
- Tracking face
- Facial landmarks
- Train your own dataset
- Without any internet!
- All devices supported.
- Add EagenFace Algorithm β
- Add Fisherface Algorithm β
- UI Component βοΈ
import Camera from 'react-native-facerecognition';
...
<Camera
ref={(cam) => {
this.camera = cam;
}}
style={styles.preview}
aspect={Camera.constants.Aspect.fill}
captureQuality={Camera.constants.CaptureQuality.high}
touchToFocus
torchMode={Camera.constants.TorchMode.on}
rotateMode={Camera.constants.RotateMode.on}
cameraType={Camera.constants.CameraType.front}
model = {Camera.constants.Model.lbp}
dataset
distance = {200}
onTrained = {this.onTrained}
onRecognized = {this.onRecognized}
onUntrained = {this.onUntrained}
onUnrecognized = {this.onUnrecognized}
/>
π₯ Checkout our main example to get the right way to start.
npm install react-native-facerecognition --save
or
yarn add react-native-facerecognition
β οΈ We are highly recommend you to use Deamon gradle for building faster and ignore any error may happen.
- Inside
build.gradleput this line inprojectName/android/build.gradle.
repositories {
...
google()
}
...
classpath 'com.android.tools.build:gradle:3.0.1'
...
allprojects {
repositories {
...
maven { url "https://jitpack.io" }
maven { url "https://maven.google.com" }
...
}
}
- And go to
projectName/android/gradle/wrapper/gradle-wrapper.propertiesand change this.
distributionUrl=https\://services.gradle.org/distributions/gradle-4.4-all.zip
- You would need to link the library once you install it.
react-native link react-native-facerecognition
- Add this line into
build.gradleand the pathprojectName/android/app/build.gradle.
compileSdkVersion 26
buildToolsVersion "26.0.2"
....
....
- Then put this lines into
settings.gradleand the pathprojectName/android/settings.gradle.
include ':openCV'
project(':openCV').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-facerecognition/android/openCV')
- You need to put permissions to use Camera on
AndroidManifest.xmland remove the line below.
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" android:required="true"/>
<uses-feature android:name="android.hardware.camera.autofocus" android:required="false"/>
<uses-feature android:name="android.hardware.camera.front" android:required="true"/>
<uses-feature android:name="android.hardware.camera.front.autofocus" android:required="false"/>
...
<activity
android:windowSoftInputMode="adjustResize" // remove this in order to make UI works well
- First, put this line into
MainApplication.javaand its pathprojectName/android/app/src/main/java/com/projectName/MainApplication.java.
import cv.reactnative.facerecognition.FaceModulePackage;
...
return Arrays.<ReactPackage>asList(
new FaceModulePackage()
);
- Then add this line into
build.gradleand the pathprojectName/android/app/build.gradle.
compileSdkVersion 26
buildToolsVersion "26.0.2"
....
....
....
dependencies {
implementation project(':react-native-facerecognition')
}
- Inside
settings.gradleput these lines you can find the path atprojectName/android/settings.gradle
include ':react-native-facerecognition'
project(':react-native-facerecognition').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-facerecognition/android/app')
include ':openCV'
project(':openCV').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-facerecognition/android/openCV')
- You need to put permissions to use Camera on
AndroidManifest.xmland remove the line below.
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" android:required="true"/>
<uses-feature android:name="android.hardware.camera.autofocus" android:required="false"/>
<uses-feature android:name="android.hardware.camera.front" android:required="true"/>
<uses-feature android:name="android.hardware.camera.front.autofocus" android:required="false"/>
...
<activity
android:windowSoftInputMode="adjustResize" // remove this in order to make UI works well
π₯ You're ready to go!
How it works:
There's three main process you have to follow the first one is to detect the face first on the image, Then you do some training on every face (Person1 & Person2 & Person3) you will need to recognize later which is the second process. Then, you can now after training, Recognize all these faces by their names.
model
- Camera.constants.Model.cascade [DEPRECATED]
- Higher recall & More trained faces
- Camera.constants.Model.landmarks
- Higher accuracy at recognition
- Camera.constants.Model.lbp
- Higher precision & Faster & Less trained faces
cameraType
- Camera.constants.CameraType.front
- Camera.constants.CameraType.back
captureQuality
- Camera.constants.CaptureQuality.low
- Camera.constants.CaptureQuality.medium
- Camera.constants.CaptureQuality.high
aspect
- Camera.constants.Aspect.fit
- Camera.constants.Aspect.fill
- Camera.constants.Aspect.stretch
dataset (default: false)
- train your own images. copy Images to that location at
react-native-facerecognition/android/app/src/main/assets/datasetinside that folder.
if you will use this, you need to use lbp model only in order to make it work. Please see the test photo there to know how to rename your photos according to that test photo every photo should be named like that name_number.jpg/png.
distance
<Camera distance = {200} />
- Distance between the face and the camera. This is very important to keep recognition always works and to help make the result mainly true (this effects the recognition result grossly).
rotateMode - (Landscape/Portrait)
- Camera.constants.RotateMode.on
- Camera.constants.RotateMode.off
- takePicture()
Take a picture then process it to detect face inside
- train(Object)
Train the algorithm with a new detected face
- identify()
Take a picture then predict whom face belongs to
- clear()
Clear all previous trained faces
onTrained
- Called after success training
onUntrained
- If training fails this function will be called with the error
onRecognized
You get details about recognized face:
nameThe face nameconfidenceThis number indicates how much the result is true. Usually low number < 100 means a good result depends on the distance you put
onUnrecognized
- If recognition fails this function will be called with the error
If you're not familiar with OpenCV and face recognition you have to be in safe and use our default arguments as we care about all of the details for you. In case of using your own arguments please note that you may effect the accuracy depends on your settings.
-
Recognition default arguments
Arguments- distance = {200}
-
Training images count
Minimum- There's no maximum but the average is 3~4 photos per face to guarantee high accuracy
π Updates you can find all previous versions and updates up to date!
MIT

