Skip to main content
Version: v5

Getting Started with CometChat Android UI Kit

The CometChat UI Kit for Android streamlines the integration of in-app chat functionality by providing a comprehensive set of prebuilt UI components. It offers seamless theming options, including light and dark modes, customizable fonts, colors, and extensive styling capabilities.

With built-in support for one-to-one and group conversations, developers can efficiently enable chat features within their applications. Follow this guide to quickly integrate chat functionality using the CometChat Android UI Kit.

Image

Prerequisites​

Before installing the CometChat UI Kit for Android, you must first create a CometChat application via the CometChat Dashboard. The dashboard provides all the essential chat service components, including:

  • User Management
  • Group Chat & Messaging
  • Voice & Video Calling
  • Real-time Notifications
note

To initialize the UI Kit, you will need the following credentials from your CometChat application:

  1. App ID
  2. Auth Key
  3. Region

Ensure you have these details ready before proceeding with the installation and configuration.

Register & Set Up CometChat​

Follow these steps to register on CometChat and set up your development environment.

Step 1: Register on CometChat​

To use CometChat UI Kit, you first need to register on the CometChat Dashboard.

🔗 Click here to Sign Up

Step 2: Get Your Application Keys​

After registering, create a new app and retrieve your authentication details:

  1. Navigate to Application, then select the Credentials section.
  2. Note down the following keys:
    • App ID
    • Auth Key
    • Region
note

Each CometChat application can be integrated with a single client app. Users within the same application can communicate across multiple platforms, including web and mobile.

Step 3: Set Up Your Development Environment​

Ensure your system meets the following prerequisites before proceeding with integration.

System Requirements:

  • Android Studio installed on your machine.
  • An Android emulator or physical device running Android 6.0 or higher.
  • Java 8 or higher installed.
  • Gradle plugin 4.0.1 or later installed.

Getting Started​

Step 1: Create an Android Project​

  1. Open Android Studio and start a new project.
  2. Choose Empty Activity as the project template.
  3. Enter a project name and choose Java or Kotlin as the language.
  4. Set minimum API level to 21 or higher.

Step 2: Install Dependencies​

To integrate CometChat into your Android project, add the required dependencies to your Gradle configuration.

i. Add the CometChat Repository​

To integrate CometChat into your Android project, you need to add the CometChat repository to your project-level settings.gradle or settings.gradle.kts file. Follow the steps below based on your project configuration.

settings.gradle.kts
dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        maven("https://dl.cloudsmith.io/public/cometchat/cometchat/maven/")
    }
}

ii. Add the CometChat Dependency​

Inside libs.versions.toml, add the CometChat Chat UI Kit version under the [versions] section:

libs.versions.toml
[versions]
cometchat-ui-kit = "5.0.2"
cometchat-calls-sdk = "4.1.0"

Under the [libraries] section, define the library and reference the version:

libs.versions.toml
[libraries]
cometchat-ui-kit = { module = "com.cometchat:chat-uikit-android", version.ref = "cometchat-ui-kit" }
cometchat-calls-sdk = { module = "com.cometchat:calls-sdk-android", version.ref = "cometchat-calls-sdk" }

Now, in your app-level build.gradle.kts file, add the dependency using libs from Version Catalogs:

build.gradle.kts
dependencies {
    implementation(libs.cometchat.ui.kit)

    // (Optional) Include if using voice/video calling features
    implementation(libs.cometchat.calls.sdk)
}

iii. Add AndroidX Support​

The Jetifier tool helps migrate legacy support libraries to AndroidX.

Open the gradle.properties file and verify if the specified line is present. If not, add it accordingly.

gradle.properties
android.enableJetifier=true

Step 3: Initialize & Login to CometChat UI Kit​

To authenticate a user, you need a UID. You can either:

  1. Create new users on the CometChat Dashboard, CometChat SDK Method or via the API.

  2. Use pre-generated test users:

    • cometchat-uid-1
    • cometchat-uid-2
    • cometchat-uid-3
    • cometchat-uid-4
    • cometchat-uid-5

The Login method returns a User object containing all relevant details of the logged-in user.

Auth Key Usage

The Auth Key is an optional property of the UIKitSettings class. It is primarily recommended for proof-of-concept (POC) development or early-stage application development.

For secure authentication, use the Auth Token method instead.

info

Security Best Practices

  • The Auth Key method is recommended for proof-of-concept (POC) development and early-stage testing.
  • For production environments, it is strongly advised to use an Auth Token instead of an Auth Key to enhance security and prevent unauthorized access.
MainActivity.kt
import android.os.Bundle
import android.util.Log
import androidx.activity.ComponentActivity
import androidx.activity.enableEdgeToEdge
import com.cometchat.chat.core.CometChat
import com.cometchat.chat.exceptions.CometChatException
import com.cometchat.chat.models.User
import com.cometchat.chatuikit.shared.cometchatuikit.CometChatUIKit
import com.cometchat.chatuikit.shared.cometchatuikit.UIKitSettings

class MainActivity : ComponentActivity() {

    private val TAG = "MainActivity"

    private val appID = "APP_ID" // Replace with your App ID
    private val region = "REGION" // Replace with your App Region
    private val authKey = "AUTH_KEY" // Replace with your Auth Key or leave blank if you are authenticating using Auth Token

    private val uiKitSettings = UIKitSettings.UIKitSettingsBuilder()
        .setRegion(region)
        .setAppId(appID)
        .setAuthKey(authKey)
        .subscribePresenceForAllUsers()
        .build()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()

        CometChatUIKit.init(this, uiKitSettings, object : CometChat.CallbackListener<String?>() {
            override fun onSuccess(successString: String?) {

                Log.d(TAG, "Initialization completed successfully")

                loginUser()
            }

            override fun onError(e: CometChatException?) {}
        })
    }

    private fun loginUser() {
        CometChatUIKit.login("cometchat-uid-1", object : CometChat.CallbackListener<User>() {
            override fun onSuccess(user: User) {

                // ✅ Option 1: Launch One-to-One or Group Chat Screen
                // val intent = Intent(this@MainActivity, MessageActivity::class.java)
                // intent.putExtra("uid", "cometchat-uid-1")
                // startActivity(intent)

                // ✅ Option 2: Launch Conversation List + Message View (Split-Screen Style)
                // startActivity(Intent(this@MainActivity, ConversationActivity::class.java))

                // ✅ Option 3: Launch Tab-Based Chat Experience (Chats, Calls, Users, Groups)
                // startActivity(Intent(this@MainActivity, TabbedActivity::class.java))
            }

            override fun onError(e: CometChatException) {
                // Handle login failure (e.g. show error message or retry)
                Log.e("Login", "Login failed: ${e.message}")
            }
        })
    }
}
note

Ensure you replace the following placeholders with your actual CometChat credentials:

  • APP_ID → Your CometChat App ID
  • AUTH_KEY → Your CometChat Auth Key
  • REGION → Your App Region

These values are required for proper authentication and seamless integration.

Step 4: Set Up Global Theme​

To customize component styling across your application in one place, you need to set up the CometChat Theme.

Use the CometChatTheme.DayNight style, which is built on Theme.MaterialComponents.DayNight.NoActionBar.

Apply the Theme

Set CometChatTheme.DayNight as the parent theme for your application in the themes.xml file.

themes.xml
<style name="YourAppParentTheme" parent="CometChatTheme.DayNight"/>
AndroidManifest.xml
    <application
        android:theme="@style/YourAppParentTheme"
        ...
        ...
    >

    </application>

Step 5: Choose a Chat Experience​

Integrate a conversation view that suits your application's UX requirements. Below are the available options:

1️⃣ Conversation List + Message View​

Best for: Android apps needing a fluid tap-to-open messaging experience while managing multiple conversations.

Highlights:

  • Compact UI – Single-screen layout for mobile; tap a conversation to open the message view.
  • One-to-One & Group Chats – Handle private and group conversations natively.
  • Session Persistence – Messages and read states sync across devices.
  • Real-Time Messaging – Seamless updates for both message view and conversation list.
  • Smooth Navigation – Intuitive stack-based flow using FragmentManager or Jetpack Navigation.
  • Lightweight & performant – Designed for mobile responsiveness and low memory footprint.
Image

Use When:

  • You need mobile-friendly navigation between multiple chats.
  • Your app supports both 1:1 and group messaging.
  • You want a clean switch between list and message view without sidebars.

2️⃣ One-to-One / Group Chat​

Best for: Use cases where users jump directly into a chat — no list, just the conversation.

Highlights:

  • Single chat screen – Loads a specific user/group chat without navigating a list.
  • Ideal for contextual use-cases – Support chats, direct messages, or contextual onboarding flows.
  • Lightweight – Minimal UI, reduced code complexity.
  • Full-screen messaging – Immersive, distraction-free conversation experience.
  • Flexible setup – Accepts pre-fetched user/group object or ID for quick launch.
Image

Use When:

  • Your flow starts with a specific contact or ticket (e.g., customer support).
  • You want a no-frills, clean chat screen.
  • Perfect for helpdesks, dating apps, or onboarding flows.

3️⃣ Tab-Based Messaging UI (All-in-One)​

Best for: Android apps with multi-feature navigation like chats, calls, contacts, and settings — all from a single entry point.

Highlights:

  • Bottom Navigation – Use Android’s BottomNavigationView for fast switching between features.
  • Dedicated Fragments – Each tab (Chats, Calls, Users, Settings) has its own optimized view.
  • No Sidebar – Mobile-first, stack-based design, ideal for small screens.
  • Modular & Extensible – Add more tabs (e.g., Notifications, Favorites) as needed.
  • Perfect for SuperApps – Unified chat, VoIP, and user management in one interface.
  • Responsive Layouts – Adjusts to different screen sizes and orientations.
Image

Use When:

  • You want a multi-functional chat app in one interface.
  • Your users need to navigate easily between modules.
  • Ideal for support, enterprise, or social apps.

Build Your Own Chat Experience​

Best for: Developers who need complete control over their chat interface, allowing customization of components, themes, and features to align with their app’s design and functionality. Whether you're enhancing an existing chat experience or building from scratch, this approach provides the flexibility to tailor every aspect to your needs.

Recommended for:

  • Apps that require a fully customized chat experience.
  • Developers who want to extend functionalities and modify UI components.
  • Businesses integrating chat seamlessly into existing platforms.

Key Areas to Explore:

  • Android Sample App – Fully functional sample applications to accelerate your development.
  • Core Features – Learn about messaging, real-time updates, and other essential capabilities.
  • Components – Utilize prebuilt UI elements or customize them to fit your design.
  • Themes – Adjust colors, fonts, and styles to match your branding.
  • Build Your Own UI – Prefer a custom UI over our UI Kits? Explore our SDKs to create a tailored chat experience.

Next Steps​

Now that you’ve selected your chat experience, proceed to the integration guide: