Skip to main content

Veritran Docs

Integration for Android

In the integration process for Android, you need to:

  1. Access the necessary resources.

  2. Configure build.gradle and dependencies

  3. Modify the manifest

  4. Create a communication bridge between React Native and Android native code.

  5. Import Xpressplug into your ReactNative project.

Access Resources

To access the necessary resources to install XpressPlug for Android, you have to add the following code to the build.gradle file in your Android project, within the React project:

allprojects { 
   repositories { 
       maven { url "https://developer.veritran.com/resources/api/v4/groups/10/-/packages/maven"
           name "GitLab" 
           credentials(HttpHeaderCredentials) {
               name = 'Private-Token' 
               value = '<PRIVATE_TOKEN>'
           } 
           authentication {
               header(HttpHeaderAuthentication)
           }
       }
   }

Important

To obtain the private token, send an email to mobile_support@veritran.com with the "XpressPlug Access" assignment, and the team will provide you with the necessary resources.

Configure build.gradle and dependencies

Next, you need to add XpressPlug as a dependency to the current project, with any other dependencies needed. Follow these steps:

  1. Add the following values to the "dependency" block on the build.gradle file to install XpressPlug and dependencies.

    //Veritran dependencies 
implementation 'com.veritran:ui:7.9.1.49455' 
implementation 'com.veritran:ui_interfaces:7.9.1.49455' 
implementation 'com.veritran:xpressplug:7.9.1.49455' 

//Third party dependencies 
implementation 'androidx.constraintlayout:constraintlayout:2.1.3' 
implementation 'com.karumi:dexter:6.2.1' 
implementation 'org.nanohttpd:nanohttpd-webserver:2.3.1' 
implementation 'com.scottyab:rootbeer-lib:0.0.8' 
implementation 'androidx.core:core:1.3.0' 
implementation 'androidx.appcompat:appcompat:1.2.0' 
implementation 'androidx.fragment:fragment:1.1.0' 
implementation 'com.google.android.gms:play-services-basement:17.0.0' 
implementation 'org.jetbrains.kotlin:kotlin-stdlib-jdk7:1.9.0' 
implementation 'com.google.code.gson:gson:2.10.1' 
implementation 'com.google.guava:guava:31.1-android' 
implementation 'com.madgag.spongycastle:core:1.54.0.0' 
implementation 'com.madgag.spongycastle:prov:1.54.0.0' 
implementation 'com.madgag.spongycastle:pkix:1.54.0.0' 
implementation 'org.apache.commons:commons-text:1.2' 
implementation 'androidx.recyclerview:recyclerview:1.1.0' 
implementation 'com.squareup.duktape:duktape-android:1.3.0' 
implementation 'com.squareup.okhttp3:okhttp:3.12.13' 
implementation 'com.facebook.soloader:soloader:0.10.3' 
implementation 'androidx.legacy:legacy-support-v4:1.0.0' 
implementation 'org.conscrypt:conscrypt-android:2.5.2' 
implementation 'com.squareup.retrofit2:converter-gson:2.9.0' 
implementation 'com.squareup.retrofit2:retrofit:2.9.0' 
implementation 'androidx.security:security-crypto:1.0.0' 
implementation 'com.airbnb.android:lottie:3.0.7'

  2. Enable Kotlin for the project by adding the following to the build.gradle project:

    buildscript { 
    dependencies { 
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.9.0" 
    } 
}

  3. Add the following to the build.gradle module:

    apply plugin: 'kotlin-android' 
Modify the Manifest

Then, you need to modify the AndroidManifest.xml in your Android project. See the example below:

<manifest xmlns:android="http://schemas.android.com/apk/res/android" 
   xmlns:tools="http://schemas.android.com/tools" 
   package="com.reactxpressplugexample"> 
   ... 
   <application 
       ... 
       android:allowBackup="false" 
       android:fullBackupContent="false" 
       tools:replace="android:allowBackup,android:fullBackupContent,android:label">
       ... 
       <uses-library 
           android:name="org.apache.http.legacy" 
           android:required="false" /> 
       ... 
   </application> 
   ... 
</manifest>
Sync Gradle Files

Lastly, you need to sync gradle files. To do this, go to Android Studio, and go to File &amp;gt; Sync Project with Gradle Files. You can also type the following command on your terminal:

./gradlew --refresh-dependencies
Create a Communication Bridge between React Native and Android Native

It is necessary to create a class that works as a communication bridge between React Native and Android native code. To do this, follow these steps:

  1. Extend ReactContextBaseJavaModule and create a package that implements the ReactPackage interface, as shown below:

    XpressPlugModule.kt

    class XpressPlugModule(reactContext: ReactApplicationContext) : ReactContextBaseJavaModule(reactContext)
{ 

   private var initializer: XpressPlugInitializer? = null 
   private var entryPoint: XpressPlugEntryPoint? = null 
  
   override fun getName(): String { 
       return "XpressPlugModule" 
   } 

   @ReactMethod 
   fun initialize(promise: Promise) { 
       Log.i("XpressPlugModule", "---- XpressPlugModule did receive call initialize") 
       initializer = XpressPlugInitializer(promise) 
       initializer?.execute() 
   } 

   @ReactMethod 
   fun callEntryPoint(entryPointName: String, 
                      parameters: ReadableMap, 
                      outputKeys: ReadableArray, 
                      promise: Promise) { 
       Log.i("XpressPlugModule", "---- XpressPlugModule did receive call entry point") 
       val params  = HashMap<String, String>() 
       parameters.toHashMap().entries.forEach { 
           params[it.key] = it.value.toString() 
       } 
       entryPoint = XpressPlugEntryPoint(entryPointName, params, outputKeys.toArrayList(), promise)
       entryPoint?.execute() 
   } 
}

    XpressPlugPackage.kt

    class XpressPlugPackage : ReactPackage { 

    override fun createViewManagers( 
        reactContext: ReactApplicationContext 
    ): MutableList<ViewManager<View, ReactShadowNode<*>>> = mutableListOf()   

    override fun createNativeModules( 
        reactContext: ReactApplicationContext 
    ): MutableList<NativeModule> = listOf( 
        XpressPlugModule(reactContext) 
    ).toMutableList() 
}

  2. Add the created package to the ReactNativeHost class packages, which is associated to your MainApplication, as shown below:

    private final ReactNativeHost mReactNativeHost = 
    new ReactNativeHost(this) { 
        @Override 
        public boolean getUseDeveloperSupport() { 
            return BuildConfig.DEBUG; 
        } 

        @Override 
        protected List<ReactPackage> getPackages() { 
            List<ReactPackage> packages = new PackageList(this).getPackages(); 
            packages.add(new XpressPlugPackage()); 
            return packages; 
        } 

        @Override 
        protected String getJSMainModuleName() { 
            return "index"; 
        } 
    }; 

  

@Override 
public ReactNativeHost getReactNativeHost() { 
    return mReactNativeHost; 
}
Import XpressPlug into your ReactNative Project

Follow these steps to finish the integration process:

  1. Import the SDK into your ReactNative project for Android for Android.

    import {NativeModules} from 'react-native'; 
const {XpressPlugModule} = NativeModules;

  2. Invoke the XpressPlugModule's initialize method.

    const initializeXpressPlug = async () => { 
    try { 
      console.log ('---- ReactNative | Calling XpressPlugModule Initialize'); 
      const result = await XpressPlugModule.initialize(); 
      const success = result === 'true'; 
      setXpInitialized(success); 
      console.log( 
        `---- ReactNative | XpressPlugModule Initialized successfully: ${success}`); 
    } catch (e) { 
      console.error(e); 
    } 
  }; 

initializeXpressPlug();
In this section: