cometchat-android-v5-components

Companion skills: cometchat-android-v5-core covers initialization and login; cometchat-android-v5-placement covers where to put these components; cometchat-android-v5-customization covers how to modify component behavior.

Purpose

This is the single source of truth for CometChat Android UI Kit v5 component names, key methods, and usage. Check this catalog before writing any CometChat view code. If a component is not listed here, it does not exist in the UI Kit.

All components extend MaterialCardView and can be used in XML layouts or created programmatically. They follow a consistent pattern: set a User or Group object, configure visibility/style via setters, and attach callbacks for user interactions.

---

Use this skill when

• Writing code that uses any CometChat* view
• Looking up component names, methods, or XML attributes
• Composing multiple components together (e.g., message header + list + composer)
• "What components does CometChat have?"
• "How do I use CometChatConversations?"

Do not use this skill when

• Setting up init/login → use cometchat-android-v5-core
• Customizing themes/colors → use cometchat-android-v5-theming
• Writing custom message templates → use cometchat-android-v5-customization

---

1. Core messaging components

These are the components you use to build a chat experience. Most integrations use some combination of these.

CometChatConversations

Renders a scrollable list of the logged-in user's conversations (both 1:1 and group).

Key methods:

Method	Type	Description
setOnItemClick(OnItemClick<Conversation>)	Callback	Called when user taps a conversation
setSelectionMode(UIKitConstants.SelectionMode)	Config	NONE, SINGLE, MULTIPLE
setSearchBoxVisibility(int)	Visibility	Show/hide the search bar
setUserStatusVisibility(int)	Visibility	Show/hide online status indicators
setReceiptsVisibility(int)	Visibility	Show/hide read receipts
setDeleteConversationOptionVisibility(int)	Visibility	Show/hide delete option on swipe
setBackIconVisibility(int)	Visibility	Show/hide back button
setOnError(OnError)	Callback	Error handler
setOnLoad(OnLoad<Conversation>)	Callback	Called when conversations are loaded
setOnEmpty(OnEmpty)	Callback	Called when list is empty

XML usage:

<com.cometchat.chatuikit.conversations.CometChatConversations
    android:id="@+id/conversations"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Java:

CometChatConversations conversations = findViewById(R.id.conversations);
conversations.setOnItemClick((view, position, conversation) -> {
    // Navigate to message screen with conversation.getConversationWith()
});

Kotlin:

val conversations = findViewById<CometChatConversations>(R.id.conversations)
conversations.setOnItemClick { view, position, conversation ->
    // Navigate to message screen with conversation.conversationWith
}

---

CometChatMessageList

Renders messages for a specific user or group conversation. The main chat area.

Key methods:

Method	Type	Description
setUser(User)	Config	Show messages with this user (mutually exclusive with setGroup)
setGroup(Group)	Config	Show messages in this group (mutually exclusive with setUser)
setParentMessage(long)	Config	If set, shows only thread replies (note: list takes the parent ID as long via setParentMessage, NOT setParentMessageId)
setOnThreadRepliesClick(ThreadReplyClick)	Callback	Called when "Reply in Thread" is tapped
setOnError(OnError)	Callback	Error handler
setOnLoad(OnLoad<BaseMessage>)	Callback	Called when messages are loaded
setReplyInThreadOptionVisibility(int)	Visibility	Show/hide thread reply option
setReplyOptionVisibility(int)	Visibility	Show/hide reply option
setCopyMessageOptionVisibility(int)	Visibility	Show/hide copy option
setEditMessageOptionVisibility(int)	Visibility	Show/hide edit option
setDeleteMessageOptionVisibility(int)	Visibility	Show/hide delete option
setReceiptsVisibility(int)	Visibility	Show/hide read receipts
setAvatarVisibility(int)	Visibility	Show/hide sender avatars
setTextFormatters(List<CometChatTextFormatter>)	Config	Custom text formatters
setTemplates(List<CometChatMessageTemplate>)	Config	Custom message bubble templates

Java:

CometChatMessageList messageList = findViewById(R.id.messageList);
messageList.setUser(user);  // or messageList.setGroup(group);

Kotlin:

val messageList = findViewById<CometChatMessageList>(R.id.messageList)
messageList.setUser(user)  // or messageList.setGroup(group)

---

CometChatMessageComposer

A text input with send button, attachment options, emoji, and voice note support. Sends messages to the specified user or group.

Key methods:

Method	Type	Description
setUser(User)	Config	Send messages to this user
setGroup(Group)	Config	Send messages to this group
setParentMessageId(long)	Config	Thread mode — sends replies to this message
setOnSendButtonClick(SendButtonClick)	Callback	Custom send button handler
setOnError(OnError)	Callback	Error handler
setAttachmentButtonVisibility(int)	Visibility	Show/hide attachment button
setVoiceNoteButtonVisibility(int)	Visibility	Show/hide voice note button
setSendButtonVisibility(int)	Visibility	Show/hide send button
setHeaderView(View)	Custom view	Custom view above the composer
setFooterView(View)	Custom view	Custom view below the composer
setAuxiliaryButtonView(View)	Custom view	Custom auxiliary button (takes a plain View)
disableTypingEvents(boolean)	Config	Disable typing indicators (note: no set prefix)
setDisableMentions(boolean)	Config	Disable @mentions

Java:

CometChatMessageComposer composer = findViewById(R.id.composer);
composer.setUser(user);  // or composer.setGroup(group);

Kotlin:

val composer = findViewById<CometChatMessageComposer>(R.id.composer)
composer.setUser(user)  // or composer.setGroup(group)

---

CometChatMessageHeader

Displays the name, avatar, and status of the user or group at the top of a message view.

Key methods:

Method	Type	Description
setUser(User)	Config	Show header for this user
setGroup(Group)	Config	Show header for this group
setBackIconVisibility(int)	Visibility	Show/hide back button
setOnBackPress(OnBackPress)	Callback	Back button handler
setUserStatusVisibility(int)	Visibility	Show/hide online status
setVideoCallButtonVisibility(int)	Visibility	Show/hide video call button
setVoiceCallButtonVisibility(int)	Visibility	Show/hide voice call button
setSubtitleView(Function3)	Custom view	Custom subtitle view
setTrailingView(Function3)	Custom view	Custom trailing view
setLeadingView(Function3)	Custom view	Custom leading view

Java:

CometChatMessageHeader header = findViewById(R.id.header);
header.setUser(user);
header.setBackIconVisibility(View.VISIBLE);
header.setOnBackPress(() -> finish());

Kotlin:

val header = findViewById<CometChatMessageHeader>(R.id.header)
header.setUser(user)
header.setBackIconVisibility(View.VISIBLE)
header.setOnBackPress { finish() }

---

2. List components

CometChatUsers

Renders a scrollable list of users with alphabetical sticky headers.

Key methods:

Method	Type	Description
setOnItemClick(OnItemClick<User>)	Callback	Called when user taps a user
setSelectionMode(UIKitConstants.SelectionMode)	Config	NONE, SINGLE, MULTIPLE
setSearchBoxVisibility(int)	Visibility	Show/hide search bar
setUserStatusVisibility(int)	Visibility	Show/hide online status
setOnSelection(OnSelection<User>)	Callback	Called when selection changes

CometChatGroups

Renders a scrollable list of groups.

Key methods:

Method	Type	Description
setOnItemClick(OnItemClick<Group>)	Callback	Called when user taps a group
setSelectionMode(UIKitConstants.SelectionMode)	Config	NONE, SINGLE, MULTIPLE
setSearchBoxVisibility(int)	Visibility	Show/hide search bar
setOnSelection(OnSelection<Group>)	Callback	Called when selection changes

CometChatGroupMembers

Renders the member list for a specific group.

Key methods:

Method	Type	Description
setGroup(Group)	Config	Required — the group to show members for
setOnItemClick(OnItemClick<GroupMember>)	Callback	Called when user taps a member
setSelectionMode(UIKitConstants.SelectionMode)	Config	NONE, SINGLE, MULTIPLE

---

3. Call components

CometChatCallLogs

Renders a list of past calls with duration, type, and timestamp.

CometChatIncomingCall

Incoming call notification banner with accept/reject buttons. Typically added to your root Activity layout.

CometChatOutgoingCall

Outgoing call screen with ringing indicator.

CometChatOngoingCall

Active call view (video/audio, controls).

---

4. Other components

CometChatSearch

Search component for finding conversations and messages.

CometChatReactionList

Full reaction list showing who reacted with which emoji.

CometChatThreadHeader

Thread header with parent message preview and reply count.

---

5. Shared views (building blocks)

These are lower-level views used inside the main components:

View	Description
CometChatAvatar	User/group avatar (image + fallback initials)
CometChatBadge	Unread count badge
CometChatStatusIndicator	Online/offline status dot
CometChatMessageReceipt	Message delivery/read receipt icons
CometChatDate	Formatted date display
CometChatMessageBubble	Message bubble container
CometChatEmojiKeyboard	Emoji picker grid
CometChatConfirmDialog	Confirmation dialog
CometChatPopupMenu	Context menu / popup menu

---

6. Composition patterns

Two-pane chat (conversation list + message view)

The most common pattern — conversation list on one side, active chat on the other. On phones, this is typically two Activities or Fragments with navigation between them.

Java:

// In ConversationsFragment or Activity
CometChatConversations conversations = findViewById(R.id.conversations);
conversations.setOnItemClick((view, position, conversation) -> {
    Intent intent = new Intent(this, MessagesActivity.class);
    if (conversation.getConversationType().equals("user")) {
        intent.putExtra("uid", ((User) conversation.getConversationWith()).getUid());
    } else {
        intent.putExtra("guid", ((Group) conversation.getConversationWith()).getGuid());
    }
    startActivity(intent);
});

// In MessagesActivity
CometChatMessageHeader header = findViewById(R.id.header);
CometChatMessageList messageList = findViewById(R.id.messageList);
CometChatMessageComposer composer = findViewById(R.id.composer);

String uid = getIntent().getStringExtra("uid");
if (uid != null) {
    CometChat.getUser(uid, new CometChat.CallbackListener<User>() {
        @Override
        public void onSuccess(User user) {
            header.setUser(user);
            messageList.setUser(user);
            composer.setUser(user);
        }

        @Override
        public void onError(CometChatException e) { }
    });
}

Kotlin:

// In ConversationsFragment or Activity
val conversations = findViewById<CometChatConversations>(R.id.conversations)
conversations.setOnItemClick { view, position, conversation ->
    val intent = Intent(this, MessagesActivity::class.java)
    when (conversation.conversationType) {
        "user" -> intent.putExtra("uid", (conversation.conversationWith as User).uid)
        "group" -> intent.putExtra("guid", (conversation.conversationWith as Group).guid)
    }
    startActivity(intent)
}

// In MessagesActivity
val header = findViewById<CometChatMessageHeader>(R.id.header)
val messageList = findViewById<CometChatMessageList>(R.id.messageList)
val composer = findViewById<CometChatMessageComposer>(R.id.composer)

val uid = intent.getStringExtra("uid")
uid?.let {
    CometChat.getUser(it, object : CometChat.CallbackListener<User>() {
        override fun onSuccess(user: User) {
            header.setUser(user)
            messageList.setUser(user)
            composer.setUser(user)
        }
        override fun onError(e: CometChatException) { }
    })
}

Messages Activity XML layout

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.cometchat.chatuikit.messageheader.CometChatMessageHeader
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <com.cometchat.chatuikit.messagelist.CometChatMessageList
        android:id="@+id/messageList"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <com.cometchat.chatuikit.messagecomposer.CometChatMessageComposer
        android:id="@+id/composer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

Bottom navigation with tabs (Conversations + Users + Groups + Calls)

// In HomeActivity — switch fragments based on bottom nav selection
binding.bottomNavigationView.setOnItemSelectedListener(item -> {
    Fragment fragment;
    if (item.getItemId() == R.id.nav_chats) {
        fragment = new ChatsFragment();
    } else if (item.getItemId() == R.id.nav_users) {
        fragment = new UsersFragment();
    } else if (item.getItemId() == R.id.nav_groups) {
        fragment = new GroupsFragment();
    } else if (item.getItemId() == R.id.nav_calls) {
        fragment = new CallsFragment();
    } else {
        return false;
    }
    getSupportFragmentManager().beginTransaction()
        .replace(R.id.fragment_container, fragment)
        .commit();
    return true;
});

---

Hard rules

• Never invent component names. If it's not in this catalog, it doesn't exist.
• setUser() and setGroup() are mutually exclusive. Set one or the other, never both.
• Components require a logged-in user. Always verify CometChatUIKit.getLoggedInUser() != null before mounting.
• All components extend MaterialCardView. They can be used in XML or created programmatically.
• Thread mode — CometChatMessageList.setParentMessage(long) (no Id suffix on the list) and CometChatMessageComposer.setParentMessageId(long). Both must point to the same parent message ID. Without them, the list and composer show the main conversation, not the thread.