> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-audit-content-webhooks.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# CometChat UI Kit Builder For Android

> CometChat UI Kit Builder for Android provides a pre-built interface to integrate a reliable, fully-featured chat experience into new or existing apps.

The CometChat UI Kit Builder for Android provides a pre-built user interface kit that developers can use to quickly integrate a reliable & fully-featured chat experience into an existing or a new app.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-content-webhooks/Q1gl9ove-kD5IJEf/images/preview-builder-android.png?fit=max&auto=format&n=Q1gl9ove-kD5IJEf&q=85&s=d476dd379b13539dad55bda01323f745" width="3018" height="1714" data-path="images/preview-builder-android.png" />
</Frame>

***

## What is UI Kit Builder?

UI Kit Builder is CometChat's configuration system that allows you to customize chat features, UI components, and styling through a simple JSON configuration file. The builder plugin automatically generates Kotlin constants and applies styling based on your configuration.

When you design your experience in the Builder and export the code, you receive a `cometchat-builder-settings.json` file plus a sample Android module. During a Gradle build, the `com.cometchat.builder.settings` plugin reads that JSON and generates `CometChatBuilderSettings.kt` — an object of type-safe Kotlin constants. A helper class, `BuilderSettingsHelper.kt`, then reads those constants and applies them to the standard [CometChat Android UI Kit](/ui-kit/android/getting-started) components (`CometChatMessageHeader`, `CometChatMessageList`, `CometChatMessageComposer`, and others).

<Note>
  The Builder is a configuration layer on top of the regular Android UI Kit — it does not replace it. Anything you can do with the UI Kit directly (custom message templates, view slots, themes) is still available after you integrate the Builder. See [Where the Builder fits](#where-the-builder-fits) below.
</Note>

***

## Benefits of Using UI Kit Builder

| Benefit             | Description                                |
| ------------------- | ------------------------------------------ |
| Easy Configuration  | Change features without modifying code     |
| Type-Safe Constants | Auto-generated Kotlin constants            |
| Consistent Styling  | Automatic theme generation                 |
| Feature Toggling    | Enable/disable features dynamically        |
| No Code Changes     | Modify behavior through JSON configuration |

***

## Available Builder Settings Categories

The Builder configuration supports the following categories:

| Category                  | Description                                                |
| ------------------------- | ---------------------------------------------------------- |
| Core Messaging Experience | Basic chat features (typing, file sharing, etc.)           |
| Deeper User Engagement    | Advanced features (reactions, polls, translation)          |
| AI User Copilot           | AI-powered features (smart replies, conversation starters) |
| Group Management          | Group creation, member management                          |
| Moderator Controls        | User moderation (kick, ban, promote)                       |
| Voice & Video Calling     | Call-related features                                      |
| Layout & Styling          | UI customization and theming                               |

***

## Where the Builder Fits

The Builder gives you fast, JSON-driven control over **which features are on** and **broad styling**. For anything more granular, you drop down to the same customization layers the standalone UI Kit exposes. These layers stack — the Builder configures the components, and you can still customize those components further.

| Layer                       | What it controls                                                            | Where to configure                                                                             |
| --------------------------- | --------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- |
| **Builder feature toggles** | Enable/disable features, layout, tabs, brand color, font                    | [Builder Settings](/chat-builder/android/builder-settings) (`cometchat-builder-settings.json`) |
| **Theme overrides**         | Colors, typography, component style attributes                              | [Theme Introduction](/ui-kit/android/theme-introduction) (`themes.xml`)                        |
| **Message Templates**       | Custom bubble structure, content/header/reply views, bubble interactions    | [Message Template](/ui-kit/android/message-template)                                           |
| **Component View Slots**    | Replace specific regions of a list item (avatar, title, subtitle, trailing) | [View Slots](/ui-kit/android/customization-view-slots)                                         |
| **DataSource decorators**   | Global, message-level overrides (options, attachments, formatting)          | [DataSource & ChatConfigurator](/ui-kit/android/customization-datasource)                      |

<Tip>
  Start with the [Customization Overview](/ui-kit/android/customization-overview) to understand the View + ViewModel + Adapter architecture before reaching for the deeper layers.
</Tip>

***

## Try Live Demo

Experience the CometChat UI Kit Builder in action:

<CardGroup>
  <Card title="Launch Live Demo" icon="play" href="https://preview.cometchat.com/" />
</CardGroup>

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Integration Guide" icon="code" href="/chat-builder/android/integration">
    Step-by-step instructions to integrate the UI Kit Builder into your Android project.
  </Card>

  <Card title="Builder Settings" icon="sliders" href="/chat-builder/android/builder-settings">
    Complete reference of all configuration options available in CometChatBuilderSettings.
  </Card>

  <Card title="Customizations" icon="paintbrush" href="/chat-builder/android/builder-customisations">
    Learn how to customize components using BuilderSettingsHelper.
  </Card>

  <Card title="Directory Structure" icon="folder-tree" href="/chat-builder/android/builder-dir-structure">
    Understand the organization of the exported Builder code.
  </Card>
</CardGroup>

***

## Helpful Resources

<CardGroup>
  <Card title="Android Builder App" href="https://play.google.com/store/apps/details?id=com.cometchat.builder.java&hl=en_IN&pli=1">
    Experience the power of CometChat UI Kit with this interactive app
  </Card>

  <Card title="UI Kit Source Code" href="https://github.com/cometchat/cometchat-uikit-android/tree/v5">
    Access the complete Android UI Kit source code
  </Card>

  <Card title="Figma Design File" href="https://www.figma.com/community/file/1444324233177163609/cometchat-ui-kit-for-android">
    UI design resources for customization and prototyping
  </Card>

  <Card title="Create Support Ticket" href="https://help.cometchat.com/hc/en-us/requests/new">
    Get assistance from our support team with any questions or issues
  </Card>
</CardGroup>