Chat21 is the core of the open source live chat platform Tiledesk.com.

Chat21 SDK Documentation

Features

With Chat21 Android SDK you can:

Sample

Screenshots

| |

|

Google Play Demo

get_it

Demo

Demo app source code is available here

Yo can build your own chat following our official tutorial

Pre requisites

Before you begin, you need a few things to set up in your environment:

Firebase libs

/project/build.gradle

First, include the google-services plugin and the Google’s Maven repository to your root-level build.gradle file:

buildscript {
    // ...
    dependencies {
        // ...
        classpath 'com.google.gms:google-services:3.1.1'
    }
}

allprojects {
    // ...
    repositories {
        // ...
        google()
    }
}
build.gradle open

/project/app/build.gradle

Then, in your module Gradle file (usually the app/build.gradle), add the apply plugin line at the bottom of the file to enable the Gradle plugin:

apply plugin: 'com.android.application'
// ...
dependencies {
    // ...
    implementation "com.google.android.gms:play-services:11.8.0"
}
// ... 
apply plugin: 'com.google.gms.google-services'
build.gradle open

Install Chat21 libraries

Set:

Add the following to your app/build.gradle file:

defaultConfig {
// ...
multiDexEnabled true
}
dependencies {
// ...
compile 'com.android.support:multidex:1.0.1'
compile "com.google.android.gms:play-services:11.8.0"
compile 'com.android.support:design:26.1.0'

compile 'org.chat21.android:chat21:1.0.10'
compile 'com.vanniktech:emoji-ios:0.5.1'
}
// ...
configurations.all {
    resolutionStrategy.eachDependency { DependencyResolveDetails details ->
        def requested = details.requested
        if (requested.group == 'com.android.support') {
            if (!requested.name.startsWith("multidex")) {
                details.useVersion '26.1.0'
            }
        }
    }
}
build.gradle open

Google Play Services plugin

Finally, as described in the documentation, paste this statement as the last line of the file:

apply plugin: 'com.google.gms.google-services'

At the end, you'll download a google-services.json file. For more informations refer to the relative documentation

Application

Create a custom Application class

public class AppContext extends Application {

@Override
protected void attachBaseContext(Context base) {
    super.attachBaseContext(base);
           MultiDex.install(this); // add this
    }
}
AppContext.java open

and add it to the Manifest.xml

 <application
             android:name=".AppContext"
             android:icon="@mipmap/ic_launcher"
             android:label="@string/app_name"
             android:theme="@style/AppTheme"
             ...
</application> 
AndroidManifest.xml open

Style

Replace the default parent theme in your styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

to

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

you will obtain something like :

  <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
   <!-- Customize your theme here. -->
   <item name="colorPrimary">@color/colorPrimary</item>
   <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
   <item name="colorAccent">@color/colorAccent</item>
</style> 
styles.xml open

Chat21 SDK initialization

ChatManager

The Chat21 SDK provide a Chat.Configuration object which allows to set some custom behaviour and settings for your chat.

To create a new instance of Chat21 SDK you have to create your own configuration (using the Chat21 SDK Chat.Configuration.Builder) and use it as paramater for the method Chat.initialize(configuration);

    // optional
    //enable persistence must be made before any other usage of FirebaseDatabase instance.
    FirebaseDatabase.getInstance().setPersistenceEnabled(true);

    // mandatory
    // it creates the chat configurations
    ChatManager.Configuration mChatConfiguration =
            new ChatManager.Configuration.Builder(<APP_ID>)
                    .firebaseUrl(<FIREBASE_DATABASE_URL>)
                    .storageBucket(<STORAGE_BUCKET>)
                    .build();

    ChatManager.start(<CONTEXT>, mChatConfiguration, <LOGGED_USER>);

Replace:

AppContext.java open

ChatUI

ChatUI allows you to quickly connect common UI elements to Chat21 SDK APIs.

ChatUI lets you start your chat with both an activity and a inside a fragment.

Initialize the ChatUI component with the following instruction

ChatUI.getInstance().setContext(this);
Launch with an activity

It starts a new activity that contains the list of conversations.

 ChatUI.getInstance().showConversationsListActivity();
Example.java open
Launch with a fragment

You have to create a fragment with a container inside.

The chat will start inside this container where the list of conversations is shown.

<android.support.design.widget.CoordinatorLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</android.support.design.widget.CoordinatorLayout>

Now you can show your chat with the following method:

  ChatUI.getInstance().openConversationsListFragment(getChildFragmentManager(), R.id.container);
ChatFragment.java open

Common Issues

AndroidManifest.xml open

Deploy JCenter

Follow this guide to deploy your own library to JCenter