Chat21 is the core of the open source live chat platform Tiledesk.com.
With Chat21 Android SDK you can:
| |
|
Demo app source code is available here
Yo can build your own chat following our official tutorial
Before you begin, you need a few things to set up in your environment:
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()
}
}
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'
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'
}
}
}
}
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
Create a custom Application class
public class AppContext extends Application {
@Override
protected void attachBaseContext(Context base) {
super.attachBaseContext(base);
MultiDex.install(this); // add this
}
}
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>
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>
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:
<APP_ID>
with your appId;<FIREBASE_URL>
with your Firebae Database URL of your Firebase App;<STORAGE_BUCKET>
with your Firebae Storage Bucket URL of your Firebase App;<CONTEXT>
with your Context;<LOGGED_USER>
with your current logged user, assuming it is an instance of IChatUserChatUI 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);
It starts a new activity that contains the list of conversations.
ChatUI.getInstance().showConversationsListActivity();
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);
Conflicts within com.android.support
Error:
* What went wrong:
Execution failed for task ':app:processDebugResources'.
> Failed to execute aapt
Solution: Copy this block at the bottom of your file /project/app/build.gradle
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'
}
}
}
}
MultiDex
Error:
Error:Execution failed for task ':app:transformDexArchiveWithExternalLibsDexMergerForDebug'.
> java.lang.RuntimeException: java.lang.RuntimeException: com.android.builder.dexing.DexArchiveMergerException: Unable to merge dex
Solution:
Make sure you have added multiDexEnabled true
inside of /project/app/build.gradle
Copy this block inside of your custom Application class
@Override
protected void attachBaseContext(Context base) {
super.attachBaseContext(base);
MultiDex.install(this);
}
Theme
Error:
RuntimeException: Unable to start activity ComponentInfo{my.sample.package.myapplication/chat21.android.ui.conversations.activities.ConversationListActivity}: java.lang.IllegalStateException:
This Activity already has an action bar supplied by the window decor. Do not request Window.FEATURE_SUPPORT_ACTION_BAR and set windowActionBar to false in your theme to use a Toolbar instead.
Solution: See the Style section
Application name exceptions:
Error:
/android/MyApp/app/src/main/AndroidManifest.xml:30:9 Error:
Attribute application@label value=(@string/application_name) from AndroidManifest.xml:30:9
is also present at {Library Name} value=(@string/app_name)
Suggestion: add 'tools:replace="android:label"' to <application> element at AndroidManifest.xml:26:5 to override
Solution:
Add the tools:replace="android:label"
to override the Chat21 SDK app name and default icon:
```
<application
android:name=".AppContext"
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme"
tools:replace="android:label, android:icon"> <!-- add this -->
. . .
</application>
```
Follow this guide to deploy your own library to JCenter