1. Setup the React Native development environment based on the development and target OS by following the steps here,

Setting up the development environment

Github Repository - https://github.com/Idmission-LLC/SdkReactSample

2. Download and unzip the ReactNativeSDKAndroidResources archive, it consists of the react-native, android_resources, android_modules, reference and android_code directories. Please enter the credentials in Home.js.

        ReactNativeSDKAndroidResources

3. Create an empty React Native application

npx react-native init IDMTest

4. Add Javascript code. Copy and paste the contents of react-native folder to the main project folder. Overwrite files if required.

5. Add React Native dependencies. In package.json change the dependencies node and add resolutions node below it.

 "dependencies": {

    "@react-navigation/native": "^5.8.10",

    "@react-navigation/stack": "^5.12.8",

    "native-base": "^2.15.0",

    "react": "17.0.2",

    "react-native": "0.67.3",

    "react-native-gesture-handler": "^1.9.0",

    "react-native-safe-area-context": "^3.1.9",

    "react-native-screens": "^2.16.1",

    "react-navigation": "^4.4.4"

  },

 6. Delete node_modules folder. Build React Native application

                npm install

 7. Open android directory in Android Studio

8. Add Android dependencies. Navigate to the New Module, then Import. Add the module folders from android_modules directory one by one,

idm-imgproc

opencv

Note: If you are unable to add the modules from the UI, please copy paste the module folders in your project folder and add the following string in settings.gradle,

include ':app', ':idm-imgproc', ':opencv'

8. Add Android code. Add files from android_code directory. Overwrite files if required.

9. Modify Manifest file. An example is available in the reference directory.

        Add following property to manifest node in manifest file,

        xmlns:tools="http://schemas.android.com/tools"

        Add following property to application node in manifest file,

        tools:replace="android:name,android:allowBackup"

Add the following theme in application node,

android:theme="@style/Theme.MaterialComponents.Light.NoActionBar"

           Add the following theme in activity node,

            android:theme="@style/Theme.MaterialComponents.DayNight.NoActionBar"

10. Overwrite main build.gradle, proguard-rules.pro file from android_resources. In proguard-rules.pro file modify the following statement, replace com.idmtest with your package name,

#-keep class com.idmtest.BuildConfig { *; }

11. Modify app project’s build.gradle. An example is available in the reference directory. 

        Add following plugins on the top of the file,

apply plugin: "com.android.application"

 Add following nodes in the android node,

    compileSdkVersion 31

    buildToolsVersion "30.0.3"

    compileOptions {

        sourceCompatibility JavaVersion.VERSION_1_8

        targetCompatibility JavaVersion.VERSION_1_8

    }

    packagingOptions {

        pickFirst '**/*.so'

    }

    dexOptions{

        javaMaxHeapSize "4g"

    }

Add following nodes in the defaultConfig node,

minSdkVersion 23

targetSdkVersion 31

ndk {

    abiFilters 'armeabi-v7a', 'arm64-v8a'

}

Add following dependencies,

implementation "androidx.appcompat:appcompat:1.3.1"

implementation 'com.google.mlkit:face-detection:16.0.2'

implementation 'com.google.android.gms:play-services-mlkit-text-recognition:16.1.1'

implementation project(':idm-imgproc')

implementation project(':opencv')

implementation 'io.fotoapparat:fotoapparat:2.6.1'

implementation 'org.apache.commons:commons-lang3:3.11'

implementation 'org.tensorflow:tensorflow-lite:2.3.0'

implementation 'com.google.zxing:core:3.4.1'

12. Sync Now the code in Android Studio

13. Build and run the android app by executing the following command in Command Prompt terminal,

        npx react-native run-android --port=8081   

Link for sample app - https://drive.google.com/file/d/1fwuEancT2Ec50nTYv6tAE6lUT-Wm7XT7/view?usp=sharing