Skip to main content

Veritran Docs

Integración

[en] In the integration process for Android, you need to:

  1. [en] Access the necessary resources.

  2. [en] Configure build.gradle and dependencies

  3. [en] Modify the manifest

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

  5. [en] Import Xpressplug into your ReactNative project.

[en] Access Resources

[en] 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)
           }
       }
   }

Importante

[en] 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.

[en] Configure build.gradle and dependencies

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

  1. [en] 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. [en] 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. [en] Add the following to the build.gradle module:

    apply plugin: 'kotlin-android' 
[en] Modify the Manifest

[en] 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>
[en] Sync Gradle Files

[en] 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
[en] Create a Communication Bridge between React Native and Android Native

[en] 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. [en] Extend ReactContextBaseJavaModule and create a package that implements the ReactPackage interface, as shown below:

    [en] 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() 
   } 
}

    [en] 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. [en] 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; 
}
[en] Import XpressPlug into your ReactNative Project

[en] Follow these steps to finish the integration process:

  1. [en] Import the SDK into your ReactNative project for Android for Android.

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

  2. [en] 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();
: