Installation

React Native chat sdk

Get your Application Id

Sign up for Applozic to get your APP_ID from the install section of applozic console.

Prerequisites

iOS

Apps must target iOS 10 or later
Latest Xcode 12.0 or later required

Android

  • Latest android studio

React native

Works on the latest react native v0.63.4

Install chat plugin

install a plugin in the root directory of your react-native project.

npm install react-native-applozic-chat

Android

Add applozic-chat in gradle

STEP 1: Open project's android/app/build.gradle file add below dependency

dependencies {
    ...
    compile project(':react-native-applozic-chat')
}

STEP 2: Open android/settings.gradle and include below.

include ':react-native-applozic-chat'
project(':react-native-applozic-chat').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-applozic-chat/android')

STEP 3: Add ApplozicChatPackage in MainApplication.java

import com.applozic.ApplozicChatPackage;

@Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),new ApplozicChatPackage()
      );
    }

AndroidManifest.xml

Open the folder file YOUR_PROJECT_NAME/android/app/src/main/AndroidManifest.xml add an entry for metadata in the AndroidManifest.xml file within the application Tag and change the resource YOUR_LAUNCHER_SMALL_ICON and pass the transparent icon.

<meta-data android:name="com.applozic.mobicomkit.notification.smallIcon"
           android:resource="<YOUR_LAUNCHER_SMALL_ICON>" /> <!-- Replace this with a valid resource name for Launcher white Icon -->

 <meta-data android:name="com.package.name"
            android:value="${applicationId}" />

 <activity android:name="com.applozic.mobicomkit.uiwidgets.conversation.activity.ConversationActivity"
            android:configChanges="keyboardHidden|screenSize|smallestScreenSize|screenLayout|orientation"
            android:label="@string/app_name"
            android:parentActivityName=".MainActivity"
            android:theme="@style/ApplozicTheme"
            android:launchMode="singleTask"
            tools:node="replace">
            <!-- Parent activity meta-data to support API level 7+ -->
            <meta-data
                android:name="android.support.PARENT_ACTIVITY"
                android:value=".MainActivity" />
</activity>

Add the tools to your manifest at top of the AndroidManifest.xml file check the below code

<?xml version='1.0' encoding='utf-8'?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"

iOS

Add Pod

Setup your Podfile located at /ios/Podfile and add below pod dependency.

platform :ios, '10.0'
use_frameworks!

Navigate to YourApp/ios directory from terminal and run the below command:

pod install

📘

I do not have pod dependency

Check out how you can add pod in your react-native here

Add Bridge Files

STEP 1: Copy applozic folder from here to /ios/ folder to your project.

STEP 2: Open project from /ios/ folder in xcode.

🚧

Note

Please make sure to use .xcworkspace, not .xcproject after that.

STEP 3: Add all .h and .m files to your project from applozic folder in step (1)


What’s Next
Did this page help you?