Getting Started with Flutter Android SDK

REVE Chat’s Flutter Android SDK can be seamlessly integrated with your mobile apps and enable your team deliver in-app messaging to your app users for better engagement and customer support.

Introduction

This documentation shows you how to embed REVE Chat Android SDK in a Flutter based Android application and get started in a few minutes.

Necessary or minimum requirements:

1. Android Studio
2. Minimum SDK version should be 14 or above
3. SDK version (Compile, Build, Target) should be 26 or above

Flutter Android SDK integration process

Step 1:

To integrate Flutter Android SDK with your mobile app, please follow the below mentioned steps:

Add the Flutter Android SDK URL in your Project level build gradle file’s repositories section as shown below:

If android studio version less than Android Studio Arctic Fox

In project build.gradle, you can add the repositories

allprojects {
      repositories {
      …
      maven { url 'https://jitpack.io' }
      maven { url 'https://maven.google.com' }
      maven { url "https://jfrog-artifact.revechat.com/artifactory/artifactory"}
   }
}

Otherwise

In settings.gradle, you can add the repositories

dependencyResolutionManagement {                   
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        …
 	maven { url 'https://jitpack.io' }
        maven { url 'https://maven.google.com' }
        maven { url "https://jfrog-artifact.revechat.com/artifactory/artifactory"}
    }
}

Step 2:

Add Design support library and REVE Chat Flutter Android SDK as dependency in your App level build. Gradle file:

dependencies {
    …
    implementation('com.revesoft.revechatsdk:revechatsdk:1.0.14.3.1')

}

Note- You can also use Design support library greater then 26 also according to your project build SDK version.

Step 3:

Add proguard-rules.pro. Path → /android/app/proguard-rules.pro

# Add project specific ProGuard rules here.
# By default, the flags in this file are appended to flags specified
# in E:\\Android_Studio\\sdk/tools/proguard/proguard-android.txt
# You can edit the include path and order by changing the proguardFiles
# directive in build.gradle.
#
# For more details, see
#   <http://developer.android.com/guide/developing/tools/proguard.html>

# Add any project specific keep options here:

# If your project uses WebView with JS, uncomment the following
# and specify the fully qualified class name to the JavaScript interface
# class:
#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
#   public *;
#}
-keep class com.revesoft.revechatsdk.** {*;}
-keep interface com.revesoft.revechatsdk.** { *; }
-keep enum com.revesoft.revechatsdk.** { *; }
-dontwarn com.revesoft.revechatsdk.**

-keep class org.webrtc.** { *; }
-keep class org.webrtc.voiceengine.** { *; }
-dontwarn org.webrtc.**

Step 4:

Add following lines from where you want to start the chat. However, this step needs to be done differently for JAVA or KOTLIN in separate ways.

Code for JAVA

//Initializing with account id
ReveChat.init("account id");

//Creating visitor info
VisitorInfo visitorInfo = new VisitorInfo.Builder()
		.name("your name")
		.email("[email protected]")
		.phoneNumber("your number")
		.build();
 
//Set visitor info
ReveChat.setVisitorInfo(visitorInfo);
 
//Optional
//If want to Receive push notification from Reve Chat.
//Add your device token id(registration Id)
//You also need to do step 4.
ReveChat.setDeviceTokenId("deviceTokenId");
 
//starting chat window
startActivity(new Intent(this, ReveChatActivity.class));

Code for KOTLIN

//Initializing with account id
ReveChat.init("account id")

//Creating visitor info
val visitorInfo: VisitorInfo = VisitorInfo.Builder()
                .name("your name")
                .email("[email protected]")
                .phoneNumber("your number")
                .build()

//Set visitor info
ReveChat.setVisitorInfo(visitorInfo)

//Optional
//If want to Receive push notification from Reve Chat.
//Add your device token id(registration Id)
//You also need to do step 4.
ReveChat.setDeviceTokenId("deviceTokenId")

//starting chat window
startActivity(Intent(this, ReveChatActivity::class.java))

Step 5:

Extra Customization (Optional)

Add primary and primary Dark in your color.xml, if already not defined:

<color name="revechatsdk_colorPrimary">#YourColor</color>
<color name="revechatsdk_colorPrimaryDark">#YourColorDark</color>

To change chat window’s content as per your need:

<!--  screen background color --> 
<color name="revechatsdk_layout_bg">#YourColor</color>
    
<!--  Button color --> 
<color name="revechatsdk_btn_text">#YourColor</color>
<color name="revechatsdk_btn_bg">@color/revechatsdk_colorPrimary</color>
    
<!-- Chat screen colors --> 
<color name="revechatsdk_color_chat_background">#YourColor</color>
<color name="revechatsdk_color_sending_msg_bg">#YourColor</color>
<color name="revechatsdk_color_receiving_msg_bg">#YourColor</color>
<color name="revechatsdk_shape_date_bubble_bg">#YourColor</color>

<!-- Chat action bar head text
<string name="revechatsdk_title_chat_window">YOUR MESSAGE TITLE</string>