Android Kotlin Chat UI Kit

CometChat Kotlin UI Kit is a collection of custom UI Components designed to build text chat and voice/video callings features in your application. The UI Kit is developed to keep developers in mind and aims to reduce development efforts significantly.

Prerequisites ⭐

Before you begin, ensure you have met the following requirements:
✅ You have Android Studio installed in your machine
✅ Android kotlin Chat UI Kit works for the Android devices from Android 6.0 and above
✅ You have read CometChat Key Concepts.

Installing Android Kotlin Chat UI Kit

Setup 🔧

To install Android Kotlin UI Kit, you need to first register on CometChat Dashboard. Click here to sign up.

i. Get your Application Keys 🔑

Create a new app: Click Add App option available → Enter App Name & other information → Create App
You will find APP_ID, AUTH_KEY and REGION key at top in Credentials section.

ii. Add the CometChat Dependency

First, add the repository URL to the project level build.gradle file in the repositories block under the allprojects section.

allprojects {
	repositories {
		maven {
			url "https://dl.cloudsmith.io/public/cometchat/cometchat-pro-android/maven/"
		}
	}
}

Then, add CometChat to the app level build.gradle file in the dependencies section.

dependencies {
	implementation 'com.cometchat:pro-android-chat-sdk:3.0.14'
}

android {
	defaultConfig {
		manifestPlaceholders = [file_provider: "YOUR_PACKAGE_NAME"] 
		//add your application package.
	}
}

As the UI Kit uses dataBinding you must enable dataBinding to use UI Kit. To configure your app to use data binding, add the dataBinding element to your build.gradle file in the app module, as shown in the following example:

android {
	...
	dataBinding {
		enabled = true
	}
}

Finally, add the below lines android section of the app level gradle file

android {
	compileOptions {
		sourceCompatibility JavaVersion.VERSION_1_8
		targetCompatibility JavaVersion.VERSION_1_8
	}
}

Configure CometChat inside your app

i. Initialize CometChat

The init() method initializes the settings required for CometChat. Please make sure to call this method before calling any other methods from CometChat SDK.

private val appID = "APP_ID"
private val region = "REGION"
val appSettings = AppSettingsBuilder().subscribePresenceForAllUsers().setRegion(region).build()
			
CometChat.init(this, appID, appSettings, object : CallbackListener<String>() {
    override fun onSuccess(successMessage: String) {
        Log.d(TAG, "Initialization completed successfully")
    }

    override fun onError(e: CometChatException) {
         Log.d(TAG, "Initialization failed with exception: "+e.message)
    }
})

ℹ️ Note : Make sure you replace the APP_ID with your CometChat APP ID and REGION with your app's REGION in the above code.

ii.Log in your User :user:

The login() method returns the User object containing all the information of the logged-in user.

private val UID = "SUPERHERO1"
private val AUTH_KEY = "Enter AUTH_KEY"
if (CometChat.getLoggedInUser() == null) {
    CometChat.login(UID, AUTH_KEY, object : CallbackListener<User?>() {
        override fun onSuccess(user: User?) {
		Log.d(TAG, "Login Successful : "+user.toString())
    }

        override fun onError(e: CometChatException) {
		Log.d(TAG, "Login failed with exception: " + e.message);
        }
    })
} else {
  // User already logged in
}

ℹ️ Note :

The login() method needs to be called only once.
Make sure you replace the AUTH_KEY with your CometChat AUTH Key in the above code.
We have setup 5 users for testing having UIDs: SUPERHERO1, SUPERHERO2, SUPERHERO3, SUPERHERO4 and SUPERHERO5.

Add UI Kit Library to your project

To integrate CometChat kotlin UIKit inside your app. Kindly follow the below steps:

Simply clone the UI Kit-Kotlin Library from android-kotlin-chat-uikit repository.
Import uikit-kotlin Module from Module Settings. ( To know how to import uikit-kotlin as Module visit this link )
If the Library is added successfully, it will look like mentioned in the below image.

Next steps is to adding necessary dependancies inside your app to integrate UI Kit-Kotlin.

To use UI Kit-Kotlin you have to add Material Design Dependency as the UI Kit uses Material Design Components.

implementation 'com.google.android.material:material:<version>'

ℹ️ Note :

As UI Kit-Kotlin is using material components your app's theme should extend Theme.MaterialComponents. Follow the guide on Getting started Material Components

The following is the list of Material Components themes you can use to get the latest component styles and theme-level attributes.

Theme.MaterialComponents
Theme.MaterialComponents.NoActionBar
Theme.MaterialComponents.Light
Theme.MaterialComponents.Light.NoActionBar
Theme.MaterialComponents.Light.DarkActionBar
Theme.MaterialComponents.DayNight
Theme.MaterialComponents.DayNight.NoActionBar
Theme.MaterialComponents.DayNight.DarkActionBar

Update your app theme to inherit from one of these themes, e.g.:

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

    <!-- Customize your theme here. -->

</style>

Launch UI Unified

UI Unified is a way to launch a fully working chat application using the CometChat Kitchen Sink. In UI Unified all the UI Screens and UI Components working together to give the full experience of a chat application with minimal coding effort.

To use Unified UI user has to launch CometChatUnified class

Add the following code snippet in onSuccess of CometChat login.

startActivity(Intent(this@YourActivity, CometChatUnified::class.java))

Checkout our sample apps

Kotlin:

Visit our Kotlin sample app repo to run the kotlin sample app.

Java:

Visit our Java sample app repo to run the Java sample app.

Troubleshooting

To read the full documentation on UI Kit integration visit our Documentation.
Facing any issues while integrating or installing the UI Kit please connect with us via real time support present in CometChat Dashboard..

Contributors

Thanks to the following people who have contributed to this project:
@poojashivane
@vivekprajapati

📫 Contact

License

This project uses the following license: License.

andraantariksa/android-kotlin-chat-ui-kit