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

# Group Members

> Scrollable list of all members in a group with search, avatars, names, scope badges, and online/offline status.

<Accordion title="AI Integration Quick Reference">
  ```json theme={null}
  {
    "component": "CometChatGroupMembers",
    "package": "com.cometchat.chatuikit.groupmembers",
    "xmlElement": "<com.cometchat.chatuikit.groupmembers.CometChatGroupMembers />",
    "description": "Scrollable list of all members in a group with search, avatars, names, scope badges, and online/offline status indicators. Requires a Group object to be set via setGroup().",
    "primaryOutput": {
      "method": "setOnItemClick",
      "type": "OnItemClick<GroupMember>"
    },
    "methods": {
      "data": {
        "setGroup": {
          "type": "Group",
          "required": true,
          "note": "Must be called before the component can load data"
        },
        "setGroupMembersRequestBuilder": {
          "type": "GroupMembersRequest.GroupMembersRequestBuilder",
          "default": "SDK default",
          "note": "Pass the builder, not the result of .build()"
        },
        "setSearchRequestBuilder": {
          "type": "GroupMembersRequest.GroupMembersRequestBuilder",
          "default": "Same as main builder",
          "note": "Separate builder for search results"
        }
      },
      "callbacks": {
        "setOnItemClick": "OnItemClick<GroupMember>",
        "setOnItemLongClick": "OnItemLongClick<GroupMember>",
        "setOnBackPressListener": "OnBackPress",
        "setOnSelection": "OnSelection<GroupMember>",
        "setOnError": "OnError",
        "setOnLoadMore": "OnLoad<GroupMember>",
        "setOnEmpty": "OnEmpty"
      },
      "visibility": {
        "setBackIconVisibility": { "type": "int (View.VISIBLE | View.GONE)", "default": "View.GONE" },
        "setToolbarVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setLoadingStateVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setErrorStateVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setEmptyStateVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setSeparatorVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setUserStatusVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setSearchBoxVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setKickMemberOptionVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setBanMemberOptionVisibility": { "type": "int", "default": "View.VISIBLE" },
        "setScopeChangeOptionVisibility": { "type": "int", "default": "View.VISIBLE" }
      },
      "selection": {
        "setSelectionMode": {
          "type": "UIKitConstants.SelectionMode",
          "values": ["NONE", "SINGLE", "MULTIPLE"],
          "default": "NONE"
        }
      },
      "viewSlots": {
        "setItemView": "GroupMembersViewHolderListeners — entire list item row",
        "setLeadingView": "GroupMembersViewHolderListeners — avatar / left section",
        "setTitleView": "GroupMembersViewHolderListeners — name / title text",
        "setSubtitleView": "GroupMembersViewHolderListeners — subtitle text below name",
        "setTrailingView": "GroupMembersViewHolderListeners — right section",
        "setLoadingStateView": "@LayoutRes int — loading spinner",
        "setEmptyStateView": "@LayoutRes int — empty state",
        "setErrorStateView": "@LayoutRes int — error state",
        "setOverflowMenu": "View — toolbar menu",
        "setOptions": "Function3<Context, GroupMember, Group, List<MenuItem>> — long-press context menu (replaces defaults)",
        "addOptions": "Function3<Context, GroupMember, Group, List<MenuItem>> — long-press context menu (appends to defaults)"
      },
      "advanced": {
        "selectGroupMember": "GroupMember, SelectionMode — programmatic selection",
        "getSelectedGroupMembers": "List<GroupMember> — returns selected items",
        "setSearchKeyword": "String — programmatic search",
        "setTitleText": "String — custom toolbar title",
        "excludeOwner": "boolean — exclude group owner from list",
        "getBinding": "CometchatGroupMembersListViewBinding — root ViewBinding",
        "getViewModel": "GroupMembersViewModel — internal ViewModel access",
        "getAdapter": "GroupMembersAdapter — internal adapter access",
        "setAdapter": "GroupMembersAdapter — replace the default adapter"
      },
      "style": {
        "setStyle": {
          "type": "@StyleRes int",
          "parent": "CometChatGroupMembersStyle"
        }
      }
    },
    "events": [
      {
        "name": "CometChatGroupEvents.ccGroupMemberBanned",
        "payload": "Action, User, User, Group",
        "description": "A group member was banned from the group"
      },
      {
        "name": "CometChatGroupEvents.ccGroupMemberKicked",
        "payload": "Action, User, User, Group",
        "description": "A group member was kicked from the group"
      },
      {
        "name": "CometChatGroupEvents.ccGroupMemberScopeChanged",
        "payload": "Action, User, String, String, Group",
        "description": "A group member's scope was changed"
      },
      {
        "name": "CometChatGroupEvents.ccGroupMemberAdded",
        "payload": "List<Action>, List<User>, Group, User",
        "description": "Members were added to the group"
      },
      {
        "name": "CometChatGroupEvents.ccGroupMemberUnBanned",
        "payload": "Action, User, User, Group",
        "description": "A group member was unbanned"
      },
      {
        "name": "CometChatGroupEvents.ccOwnershipChanged",
        "payload": "Group, GroupMember",
        "description": "Group ownership was transferred"
      }
    ],
    "sdkListeners": [
      "onGroupMemberJoined",
      "onGroupMemberLeft",
      "onGroupMemberKicked",
      "onGroupMemberBanned",
      "onGroupMemberScopeChanged",
      "onMemberAddedToGroup",
      "onUserOnline",
      "onUserOffline"
    ]
  }
  ```
</Accordion>

## Where It Fits

`CometChatGroupMembers` is a list component. It renders all members of a specific group and emits the selected `GroupMember` via `setOnItemClick`. It requires a `Group` object set via `setGroup()` before it can load data. Wire it to `CometChatMessageHeader`, `CometChatMessageList`, and `CometChatMessageComposer` to build a group messaging layout.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin GroupChatActivity.kt lines theme={null}
    class GroupChatActivity : AppCompatActivity() {

        private lateinit var groupMembers: CometChatGroupMembers
        private lateinit var messageHeader: CometChatMessageHeader
        private lateinit var messageList: CometChatMessageList
        private lateinit var messageComposer: CometChatMessageComposer

        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_group_chat)

            groupMembers = findViewById(R.id.group_members)
            messageHeader = findViewById(R.id.message_header)
            messageList = findViewById(R.id.message_list)
            messageComposer = findViewById(R.id.message_composer)

            val group = Group().apply {
                guid = "GROUP_ID"
                name = "GROUP_NAME"
            }
            groupMembers.setGroup(group)

            groupMembers.setOnItemClick { view, position, groupMember ->
                messageHeader.setUser(groupMember)
                messageList.setUser(groupMember)
                messageComposer.setUser(groupMember)
            }
        }
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java GroupChatActivity.java lines theme={null}
    public class GroupChatActivity extends AppCompatActivity {

        private CometChatGroupMembers groupMembers;
        private CometChatMessageHeader messageHeader;
        private CometChatMessageList messageList;
        private CometChatMessageComposer messageComposer;

        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_group_chat);

            groupMembers = findViewById(R.id.group_members);
            messageHeader = findViewById(R.id.message_header);
            messageList = findViewById(R.id.message_list);
            messageComposer = findViewById(R.id.message_composer);

            Group group = new Group();
            group.setGuid("GROUP_ID");
            group.setName("GROUP_NAME");
            groupMembers.setGroup(group);

            groupMembers.setOnItemClick((view, position, groupMember) -> {
                messageHeader.setUser(groupMember);
                messageList.setUser(groupMember);
                messageComposer.setUser(groupMember);
            });
        }
    }
    ```
  </Tab>
</Tabs>

## Quick Start

Add the component to your layout XML:

```xml layout_activity.xml lines theme={null}
<com.cometchat.chatuikit.groupmembers.CometChatGroupMembers
    android:id="@+id/group_member"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
```

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/PYvStVSPtwB5oVeC/images/c316bb0a-group_members-9849dc973b6addaffc0990af38520294.png?fit=max&auto=format&n=PYvStVSPtwB5oVeC&q=85&s=2c7009b254c1f3a990c851093ad92e0a" width="1280" height="800" data-path="images/c316bb0a-group_members-9849dc973b6addaffc0990af38520294.png" />
</Frame>

Prerequisites: CometChat SDK initialized with `CometChatUIKit.init()`, a user logged in, the `cometchat-chat-uikit-android` dependency added, and a valid `Group` object with a group ID (`GUID`).

Set the `Group` object in your Activity or Fragment:

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    val cometchatGroupMembers: CometChatGroupMembers = binding.groupMember

    val group = Group().apply {
        guid = "GROUP_ID"
        name = "GROUP_NAME"
    }

    cometchatGroupMembers.setGroup(group)
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    CometChatGroupMembers cometchatGroupMembers = binding.groupMember;

    Group group = new Group();
    group.setGuid("GROUP_ID");
    group.setName("GROUP_NAME");

    cometchatGroupMembers.setGroup(group);
    ```
  </Tab>
</Tabs>

> **What this does:** Creates a `Group` object with a group ID and name, then passes it to the `CometChatGroupMembers` component. The component fetches and displays all members of that group.

Or add programmatically in an Activity:

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val groupMembers = CometChatGroupMembers(this)
        val group = Group().apply {
            guid = "GROUP_ID"
            name = "GROUP_NAME"
        }
        groupMembers.setGroup(group)
        setContentView(groupMembers)
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        CometChatGroupMembers groupMembers = new CometChatGroupMembers(this);
        Group group = new Group();
        group.setGuid("GROUP_ID");
        group.setName("GROUP_NAME");
        groupMembers.setGroup(group);
        setContentView(groupMembers);
    }
    ```
  </Tab>
</Tabs>

Or in a Fragment:

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourFragment.kt lines theme={null}
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
        val groupMembers = CometChatGroupMembers(requireContext())
        val group = Group().apply {
            guid = "GROUP_ID"
            name = "GROUP_NAME"
        }
        groupMembers.setGroup(group)
        return groupMembers
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourFragment.java lines theme={null}
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        CometChatGroupMembers groupMembers = new CometChatGroupMembers(getContext());
        Group group = new Group();
        group.setGuid("GROUP_ID");
        group.setName("GROUP_NAME");
        groupMembers.setGroup(group);
        return groupMembers;
    }
    ```
  </Tab>
</Tabs>

## Filtering Group Members

Pass a `GroupMembersRequest.GroupMembersRequestBuilder` to `setGroupMembersRequestBuilder`. Pass the builder instance — not the result of `.build()`.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    val builder = GroupMembersRequest.GroupMembersRequestBuilder("GROUP_ID")
        .setLimit(10)
    cometchatGroupMembers.setGroupMembersRequestBuilder(builder)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    GroupMembersRequest.GroupMembersRequestBuilder builder = new GroupMembersRequest.GroupMembersRequestBuilder("GROUP_ID")
        .setLimit(10);
    cometchatGroupMembers.setGroupMembersRequestBuilder(builder);
    ```
  </Tab>
</Tabs>

### Filter Recipes

| Recipe               | Code                                                     |
| -------------------- | -------------------------------------------------------- |
| Limit to 10 per page | `builder.setLimit(10)`                                   |
| Search by keyword    | `builder.setSearchKeyword("john")`                       |
| Filter by scopes     | `builder.setScopes(Arrays.asList("admin", "moderator"))` |
| Admins only          | `builder.setScopes(Arrays.asList("admin"))`              |
| Moderators only      | `builder.setScopes(Arrays.asList("moderator"))`          |
| Participants only    | `builder.setScopes(Arrays.asList("participant"))`        |

> The component uses infinite scroll — the next page loads as the user scrolls to the bottom.

### Search Request Builder

Use `setSearchRequestBuilder` to customize the search list separately from the main list:

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    val searchBuilder = GroupMembersRequest.GroupMembersRequestBuilder("GROUP_ID")
        .setLimit(LIMIT)
        .setSearchKeyword(SEARCH_KEYWORD)
    cometchatGroupMembers.setSearchRequestBuilder(searchBuilder)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    GroupMembersRequest.GroupMembersRequestBuilder searchBuilder = new GroupMembersRequest.GroupMembersRequestBuilder("GROUP_ID")
        .setLimit(LIMIT)
        .setSearchKeyword(SEARCH_KEYWORD);
    cometchatGroupMembers.setSearchRequestBuilder(searchBuilder);
    ```
  </Tab>
</Tabs>

> **What this does:** Creates a `GroupMembersRequestBuilder` with a group ID, limit, and search keyword, then applies it as the search request builder. When the user searches, the component uses this builder to filter results.

## Actions and Events

### Callback Methods

#### `setOnItemClick`

Fires when a group member row is tapped. Primary navigation hook — set the active member and render the message view.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnItemClick { view, position, groupMember ->

    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnItemClick((view, position, groupMember) -> {

    });
    ```
  </Tab>
</Tabs>

> **What this does:** Replaces the default item-click behavior. When a user taps a group member, your custom lambda executes instead of the built-in navigation.

#### `setOnItemLongClick`

Fires when a group member row is long-pressed. Use for additional actions like kick, ban, or change scope.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnItemLongClick { view, position, groupMember ->

    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnItemLongClick((view, position, groupMember) -> {

    });
    ```
  </Tab>
</Tabs>

#### `setOnBackPressListener`

Fires when the user presses the back button in the app bar. Default: navigates to the previous activity.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnBackPressListener {

    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnBackPressListener(() -> {

    });
    ```
  </Tab>
</Tabs>

#### `setOnSelection`

Fires when a group member is checked/unchecked in multi-select mode. Requires `setSelectionMode` to be set.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnSelection(object : OnSelection<GroupMember?> {
        override fun onSelection(t: MutableList<GroupMember?>?) {

        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnSelection(t -> {

    });
    ```
  </Tab>
</Tabs>

#### `setOnError`

Fires on internal errors (network failure, auth issue, SDK exception).

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnError {

    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnError(cometchatException -> {

    });
    ```
  </Tab>
</Tabs>

#### `setOnLoadMore`

Fires when the list is successfully fetched and loaded.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnLoadMore(object : OnLoad<GroupMember?> {
        override fun onLoad(list: MutableList<GroupMember?>?) {

        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnLoadMore(list -> {

    });
    ```
  </Tab>
</Tabs>

#### `setOnEmpty`

Fires when the list is empty, enabling custom handling such as showing a placeholder.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setOnEmpty {

    }
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setOnEmpty(() -> {

    });
    ```
  </Tab>
</Tabs>

* **Verify**: After setting an action callback, trigger the corresponding user interaction (tap, long-press, back, select) and confirm your custom logic executes instead of the default behavior.

### Global UI Events

`CometChatGroupEvents` emits events subscribable from anywhere in the application. Add a listener and remove it when no longer needed.

| Event                       | Fires when                              | Payload                                 |
| --------------------------- | --------------------------------------- | --------------------------------------- |
| `ccGroupMemberBanned`       | A group member is banned from the group | `Action, User, User, Group`             |
| `ccGroupMemberKicked`       | A group member is kicked from the group | `Action, User, User, Group`             |
| `ccGroupMemberScopeChanged` | A group member's scope is changed       | `Action, User, String, String, Group`   |
| `ccGroupMemberAdded`        | Members are added to the group          | `List<Action>, List<User>, Group, User` |
| `ccGroupMemberUnBanned`     | A group member is unbanned              | `Action, User, User, Group`             |
| `ccOwnershipChanged`        | Group ownership is transferred          | `Group, GroupMember`                    |

<Tabs>
  <Tab title="Kotlin">
    ```kotlin Add Listener lines theme={null}
    CometChatGroupEvents.addGroupListener("LISTENER_TAG", object : CometChatGroupEvents() {
        override fun ccGroupMemberKicked(
            actionMessage: Action,
            kickedUser: User,
            kickedBy: User,
            kickedFrom: Group
        ) {
            super.ccGroupMemberKicked(actionMessage, kickedUser, kickedBy, kickedFrom)
        }

        override fun ccGroupMemberBanned(
            actionMessage: Action,
            bannedUser: User,
            bannedBy: User,
            bannedFrom: Group
        ) {
            super.ccGroupMemberBanned(actionMessage, bannedUser, bannedBy, bannedFrom)
        }

        override fun ccGroupMemberScopeChanged(
            actionMessage: Action,
            updatedUser: User,
            scopeChangedTo: String,
            scopeChangedFrom: String,
            group: Group
        ) {
            super.ccGroupMemberScopeChanged(
                actionMessage,
                updatedUser,
                scopeChangedTo,
                scopeChangedFrom,
                group
            )
        }
    })
    ```

    Remove Listener

    ```
    CometChatGroupEvents.removeListener("LISTENER_TAG")
    ```
  </Tab>

  <Tab title="Java">
    ```java Add Listener lines theme={null}
    CometChatGroupEvents.addGroupListener("LISTENER_TAG", new CometChatGroupEvents() {
        @Override
        public void ccGroupMemberKicked(Action actionMessage, User kickedUser, User kickedBy, Group kickedFrom) {
            super.ccGroupMemberKicked(actionMessage, kickedUser, kickedBy, kickedFrom);
        }

        @Override
        public void ccGroupMemberBanned(Action actionMessage, User bannedUser, User bannedBy, Group bannedFrom) {
            super.ccGroupMemberBanned(actionMessage, bannedUser, bannedBy, bannedFrom);
        }

        @Override
        public void ccGroupMemberScopeChanged(Action actionMessage, User updatedUser, String scopeChangedTo, String scopeChangedFrom, Group group) {
            super.ccGroupMemberScopeChanged(actionMessage, updatedUser, scopeChangedTo, scopeChangedFrom, group);
        }
    });
    ```

    Remove Listener

    ```
    CometChatGroupEvents.removeListener("LISTENER_TAG");
    ```
  </Tab>
</Tabs>

> **What this does:** Registers a global event listener tagged with `"LISTENER_TAG"`. When a group member is kicked, banned, or has their scope changed, the corresponding callback fires with the action details, affected user, and group information.

### SDK Events (Real-Time, Automatic)

The component listens to these SDK events internally. No manual attachment needed unless additional side effects are required.

| SDK Listener                | Internal behavior                               |
| --------------------------- | ----------------------------------------------- |
| `onGroupMemberJoined`       | Adds the new member to the list                 |
| `onGroupMemberLeft`         | Removes the member from the list                |
| `onGroupMemberKicked`       | Removes the kicked member from the list         |
| `onGroupMemberBanned`       | Removes the banned member from the list         |
| `onGroupMemberScopeChanged` | Updates the member's scope in the list          |
| `onMemberAddedToGroup`      | Adds the new member to the list                 |
| `onUserOnline`              | Updates online status indicator for the member  |
| `onUserOffline`             | Updates offline status indicator for the member |

> Automatic: group membership changes and user presence changes update the list in real time.

## Functionality

Small functional customizations such as toggling visibility of UI elements and configuring selection modes.

| Methods                          | Description                                                                              | Code                                                        |
| -------------------------------- | ---------------------------------------------------------------------------------------- | ----------------------------------------------------------- |
| `setGroup`                       | Sets the group whose members need to be fetched. Required for the component to function. | `.setGroup(group);`                                         |
| `setBackIconVisibility`          | Toggles visibility for the back button in the app bar                                    | `.setBackIconVisibility(View.VISIBLE);`                     |
| `setToolbarVisibility`           | Toggles visibility for the toolbar in the app bar                                        | `.setToolbarVisibility(View.GONE);`                         |
| `setLoadingStateVisibility`      | Hides the loading state while fetching members                                           | `.setLoadingStateVisibility(View.GONE);`                    |
| `setErrorStateVisibility`        | Hides the error state on fetching members                                                | `.setErrorStateVisibility(View.GONE);`                      |
| `setEmptyStateVisibility`        | Hides the empty state on fetching members                                                | `.setEmptyStateVisibility(View.GONE);`                      |
| `setSeparatorVisibility`         | Controls visibility of separators in the list view                                       | `.setSeparatorVisibility(View.GONE);`                       |
| `setUserStatusVisibility`        | Controls visibility of the online status indicator                                       | `.setUserStatusVisibility(View.GONE);`                      |
| `setSearchBoxVisibility`         | Controls visibility of the search box in the toolbar                                     | `.setSearchBoxVisibility(View.GONE);`                       |
| `setSelectionMode`               | Determines the selection mode (single or multiple)                                       | `.setSelectionMode(UIKitConstants.SelectionMode.MULTIPLE);` |
| `setSearchKeyword`               | Programmatically triggers a search with the given keyword                                | `.setSearchKeyword("anything");`                            |
| `setTitleText`                   | Sets a custom title in the toolbar                                                       | `.setTitleText("Members");`                                 |
| `setKickMemberOptionVisibility`  | Toggles visibility for the kick member option in the long-press menu                     | `.setKickMemberOptionVisibility(View.GONE);`                |
| `setBanMemberOptionVisibility`   | Toggles visibility for the ban member option in the long-press menu                      | `.setBanMemberOptionVisibility(View.GONE);`                 |
| `setScopeChangeOptionVisibility` | Toggles visibility for the scope change option in the long-press menu                    | `.setScopeChangeOptionVisibility(View.GONE);`               |
| `excludeOwner`                   | When true, excludes the group owner from the member list                                 | `.excludeOwner(true);`                                      |

* **Verify**: After calling a visibility method, confirm the corresponding UI element is shown or hidden.

## Custom View Slots

Each slot replaces a section of the default UI. Slots that accept a `GroupMember` parameter receive the group member object for that row via the `GroupMembersViewHolderListeners` pattern (`createView` + `bindView`).

| Slot              | Method                                             | Replaces                                      |
| ----------------- | -------------------------------------------------- | --------------------------------------------- |
| Leading view      | `setLeadingView(GroupMembersViewHolderListeners)`  | Avatar / left section                         |
| Title view        | `setTitleView(GroupMembersViewHolderListeners)`    | Name / title text                             |
| Subtitle view     | `setSubtitleView(GroupMembersViewHolderListeners)` | Subtitle text below name                      |
| Trailing view     | `setTrailingView(GroupMembersViewHolderListeners)` | Right section                                 |
| Item view         | `setItemView(GroupMembersViewHolderListeners)`     | Entire list item row                          |
| Loading view      | `setLoadingStateView(@LayoutRes int)`              | Loading spinner                               |
| Empty view        | `setEmptyStateView(@LayoutRes int)`                | Empty state                                   |
| Error view        | `setErrorStateView(@LayoutRes int)`                | Error state                                   |
| Overflow menu     | `setOverflowMenu(View)`                            | Toolbar menu                                  |
| Options (replace) | `setOptions(Function3)`                            | Long-press context menu (replaces defaults)   |
| Options (append)  | `addOptions(Function3)`                            | Long-press context menu (appends to defaults) |

### `setLeadingView`

Replace the avatar / left section.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setLeadingView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View? {
            return null
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setLeadingView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return null;
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {

        }
    });
    ```
  </Tab>
</Tabs>

> **What this does:** Registers a `GroupMembersViewHolderListeners` that provides a custom view for the leading (left) area of each group member item. `createView` inflates your layout, and `bindView` populates it with group member data.

Scope badge avatar example:

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/lojUhXqO8ysHzRtp/images/b013490a-group_members_leading_view-87dce6741e65f09e848ea6698c75e978.png?fit=max&auto=format&n=lojUhXqO8ysHzRtp&q=85&s=03923d831c2d7bd3311907d4afc2b5c8" width="2560" height="1600" data-path="images/b013490a-group_members_leading_view-87dce6741e65f09e848ea6698c75e978.png" />
</Frame>

Create a custom layout file named `custom_title_view.xml`:

```xml custom_title_view.xml lines theme={null}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/cometchat_45dp"
    android:layout_height="@dimen/cometchat_45dp"
    android:orientation="vertical">

    <com.cometchat.chatuikit.shared.views.avatar.CometChatAvatar
        android:id="@+id/avatar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <View
        android:id="@+id/batch_view"
        android:layout_width="match_parent"
        android:layout_height="@dimen/cometchat_12dp"
        android:layout_alignParentBottom="true"
        android:background="@drawable/admin_batch"
        android:visibility="gone" />

</RelativeLayout>
```

> **What this does:** Defines a custom leading view layout with a `CometChatAvatar` and a role badge view that can display different backgrounds based on the member's scope (admin, moderator, participant).

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setLeadingView(object : GroupMembersViewHolderListeners() {
        override fun createView(context: Context?, listItem: CometchatGroupMemberListItemBinding?): View {
            return LayoutInflater.from(context).inflate(R.layout.header_leading_view, null, false)
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
            val avatar = createdView.findViewById<CometChatAvatar>(R.id.avatar)
            avatar.setAvatar(groupMember.name, groupMember.avatar)
            val role = createdView.findViewById<View>(R.id.batch_view)
            if (UIKitConstants.GroupMemberScope.ADMIN == groupMember.scope) {
                role.visibility = View.VISIBLE
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.marketing_head, null)
            } else if (UIKitConstants.GroupMemberScope.MODERATOR == groupMember.scope) {
                role.visibility = View.VISIBLE
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.sr_manager, null)
            } else if (UIKitConstants.GroupMemberScope.PARTICIPANTS == groupMember.scope) {
                role.visibility = View.VISIBLE
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.content_manager, null)
            } else {
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.team_member, null)
            }
            val layoutParams = LinearLayout.LayoutParams(
                Utils.convertDpToPx(context, 40),
                Utils.convertDpToPx(context, 40)
            )
            createdView.layoutParams = layoutParams
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setLeadingView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return LayoutInflater.from(context).inflate(R.layout.header_leading_view, null, false);
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {
            CometChatAvatar avatar = createdView.findViewById(R.id.avatar);
            avatar.setAvatar(groupMember.getName(), groupMember.getAvatar());
            View role = createdView.findViewById(R.id.batch_view);
            if (UIKitConstants.GroupMemberScope.ADMIN.equals(groupMember.getScope())) {
                role.setVisibility(View.VISIBLE);
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.marketing_head, null));
            } else if (UIKitConstants.GroupMemberScope.MODERATOR.equals(groupMember.getScope())) {
                role.setVisibility(View.VISIBLE);
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.sr_manager, null));
            } else if (UIKitConstants.GroupMemberScope.PARTICIPANTS.equals(groupMember.getScope())) {
                role.setVisibility(View.VISIBLE);
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.content_manager, null));
            } else {
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.team_member, null));
            }
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(Utils.convertDpToPx(context, 40),
                                                                                   Utils.convertDpToPx(context, 40));
            createdView.setLayoutParams(layoutParams);
        }
    });
    ```
  </Tab>
</Tabs>

> **What this does:** Inflates a custom leading view layout and populates it with the group member's avatar and a role-based badge. If the member is an admin, the badge shows the `marketing_head` drawable; if a moderator, `sr_manager`; if a participant, `content_manager`; otherwise, `team_member`. The view is sized to 40dp × 40dp.

### `setTitleView`

Replace the name / title text.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setTitleView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View? {
            return null
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setTitleView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return null;
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {

        }
    });
    ```
  </Tab>
</Tabs>

Inline role badge example:

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/qyfJptTKpJBV4TKk/images/8cc2ed79-group_members_title_view-a20a9c5f8ef829a4a5d35794d94ec352.png?fit=max&auto=format&n=qyfJptTKpJBV4TKk&q=85&s=de793a67929528675f1afb77ee84f842" width="2560" height="1600" data-path="images/8cc2ed79-group_members_title_view-a20a9c5f8ef829a4a5d35794d94ec352.png" />
</Frame>

Create a custom layout file named `custom_title_view.xml`:

```xml custom_title_view.xml lines theme={null}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/user_layout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="teacher"
        android:textAppearance="?attr/cometchatTextAppearanceHeading4Medium"
        android:textColor="?attr/cometchatTextColorPrimary" />

    <View
        android:id="@+id/role"
        android:layout_width="50dp"
        android:layout_height="15dp"
        android:layout_marginStart="@dimen/cometchat_16dp"
        android:background="@drawable/team_member" />
</LinearLayout>
```

> **What this does:** Defines a custom title view layout with a `TextView` for the member name and a `View` for the role badge, arranged horizontally.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setTitleView(object : GroupMembersViewHolderListeners() {
        override fun createView(context: Context?, listItem: CometchatGroupMemberListItemBinding?): View {
            return LayoutInflater.from(context).inflate(R.layout.custom_title_view, null, false)
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
            val layout = createdView.findViewById<LinearLayout>(R.id.user_layout)
            val layoutParams = LinearLayout.LayoutParams(
                ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT
            )
            layout.layoutParams = layoutParams
            val name = createdView.findViewById<TextView>(R.id.title)
            name.text = groupMember.name
            val role = createdView.findViewById<View>(R.id.role)
            if (UIKitConstants.GroupMemberScope.ADMIN == groupMember.scope) {
                role.visibility = View.VISIBLE
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.marketing_head, null)
            } else if (UIKitConstants.GroupMemberScope.MODERATOR == groupMember.scope) {
                role.visibility = View.VISIBLE
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.sr_manager, null)
            } else if (UIKitConstants.GroupMemberScope.PARTICIPANTS == groupMember.scope) {
                role.visibility = View.VISIBLE
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.content_manager, null)
            } else {
                role.background = ResourcesCompat.getDrawable(resources, R.drawable.team_member, null)
            }
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setTitleView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return LayoutInflater.from(context).inflate(R.layout.custom_title_view, null, false);
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {
            LinearLayout layout = createdView.findViewById(R.id.user_layout);
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
                                                                                   ViewGroup.LayoutParams.WRAP_CONTENT);
            layout.setLayoutParams(layoutParams);
            TextView name = createdView.findViewById(R.id.title);
            name.setText(groupMember.getName());
            View role = createdView.findViewById(R.id.role);
            if (UIKitConstants.GroupMemberScope.ADMIN.equals(groupMember.getScope())) {
                role.setVisibility(View.VISIBLE);
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.marketing_head, null));
            } else if (UIKitConstants.GroupMemberScope.MODERATOR.equals(groupMember.getScope())) {
                role.setVisibility(View.VISIBLE);
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.sr_manager, null));
            } else if (UIKitConstants.GroupMemberScope.PARTICIPANTS.equals(groupMember.getScope())) {
                role.setVisibility(View.VISIBLE);
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.content_manager, null));
            } else {
                role.setBackground(ResourcesCompat.getDrawable(getResources(), R.drawable.team_member, null));
            }
        }
    });
    ```
  </Tab>
</Tabs>

> **What this does:** Inflates a custom title view layout and populates it with the group member's name and a role-based badge. The badge background changes based on the member's scope: `marketing_head` for admin, `sr_manager` for moderator, `content_manager` for participant, and `team_member` for others.

### `setSubtitleView`

Replace the subtitle text below the member's name.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setSubtitleView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View? {
            return null
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setSubtitleView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return null;
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {

        }
    });
    ```
  </Tab>
</Tabs>

Example with join date:

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/v-eSvFFm_r_istSu/images/2b73a513-group_members_subtitle_view-b0b1463389d35067432eaf60d8418ffe.png?fit=max&auto=format&n=v-eSvFFm_r_istSu&q=85&s=d8807c8c0c3e3c43c05018e13e174a65" width="1280" height="800" data-path="images/2b73a513-group_members_subtitle_view-b0b1463389d35067432eaf60d8418ffe.png" />
</Frame>

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setSubtitleView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View {
            return TextView(context)
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
            (createdView as TextView).text =
                "Joined at: " + SimpleDateFormat("dd/MM/yyyy, HH:mm:ss").format(groupMember.joinedAt * 1000)
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setSubtitleView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return new TextView(context);
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {
            ((TextView) createdView).setText("Joined at: " + new SimpleDateFormat("dd/MM/yyyy, HH:mm:ss").format(groupMember.getJoinedAt() * 1000));
        }
    });
    ```
  </Tab>
</Tabs>

> **What this does:** Creates a `TextView` as the subtitle view and populates it with the group member's join date formatted as "dd/MM/yyyy, HH:mm:ss". The `joinedAt` timestamp is multiplied by 1000 to convert from seconds to milliseconds.

### `setTrailingView`

Replace the right section of each group member item.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setTrailingView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View? {
            return null
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setTrailingView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return null;
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {

        }
    });
    ```
  </Tab>
</Tabs>

Scope badge example:

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/8h5BHKu3EyYXR8p_/images/fb7e32ac-group_members_tail_view-19ea33e3931012467d4df750210007fe.png?fit=max&auto=format&n=8h5BHKu3EyYXR8p_&q=85&s=c9cec9c139fd87560bedaaea7b8390a5" width="1280" height="800" data-path="images/fb7e32ac-group_members_tail_view-19ea33e3931012467d4df750210007fe.png" />
</Frame>

Create a custom layout file named `custom_tail_view.xml`:

```xml custom_tail_view.xml lines theme={null}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <com.google.android.material.card.MaterialCardView
        android:id="@+id/scope_card"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        app:cardBackgroundColor="?attr/cometchatPrimaryColor"
        app:cardCornerRadius="@dimen/cometchat_radius_max"
        app:cardElevation="@dimen/cometchat_0dp">

        <TextView
            android:id="@+id/tv_scope"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:paddingStart="@dimen/cometchat_padding_3"
            android:paddingTop="@dimen/cometchat_padding_1"
            android:paddingEnd="@dimen/cometchat_padding_3"
            android:paddingBottom="@dimen/cometchat_padding_1"
            android:text="@string/cometchat_owner"
            android:textAppearance="?attr/cometchatTextAppearanceCaption1Regular"
            android:textColor="?attr/cometchatPrimaryColor" />

    </com.google.android.material.card.MaterialCardView>

</LinearLayout>
```

> **What this does:** Defines a custom trailing view layout with a `MaterialCardView` containing a `TextView` that displays the member's scope as a colored badge.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setTrailingView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View {
            return View.inflate(context, R.layout.custom_tail_view, null)
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
            val cardView = createdView.findViewById<MaterialCardView>(R.id.scope_card)
            val tvName = createdView.findViewById<TextView>(R.id.tv_scope)
            cardView.setCardBackgroundColor(CometChatTheme.getExtendedPrimaryColor100(context))
            tvName.text = groupMember.scope
            createdView.visibility =
                if (groupMember.scope == UIKitConstants.GroupMemberScope.PARTICIPANTS) View.VISIBLE else View.GONE
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setTrailingView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return View.inflate(context, R.layout.custom_tail_view, null);
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {
            MaterialCardView cardView = createdView.findViewById(R.id.scope_card);
            TextView tvName = createdView.findViewById(R.id.tv_scope);
            cardView.setCardBackgroundColor(CometChatTheme.getExtendedPrimaryColor100(context));
            tvName.setText(groupMember.getScope());
            createdView.setVisibility(groupMember.getScope().equals(UIKitConstants.GroupMemberScope.PARTICIPANTS) ? View.VISIBLE : View.GONE);
        }
    });
    ```
  </Tab>
</Tabs>

> **What this does:** Inflates a custom trailing view that displays a scope badge for each group member. The badge background uses the extended primary color, the text shows the member's scope, and the badge is only visible for participants (hidden for admins, moderators, and owners).

### `setItemView`

Replace the entire list item row.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setItemView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View? {
            return null
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setItemView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return null;
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {

        }
    });
    ```
  </Tab>
</Tabs>

Example with name and scope:

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/U1KbQ0VSXjjiH44y/images/506c713b-group_members_list_item_view-7db7e3429ec8898cb29e584a459ec43f.png?fit=max&auto=format&n=U1KbQ0VSXjjiH44y&q=85&s=fcd85fb428205037c3391069ebc86295" width="1280" height="800" data-path="images/506c713b-group_members_list_item_view-7db7e3429ec8898cb29e584a459ec43f.png" />
</Frame>

Create a custom layout file named `item_list.xml`:

```xml item_list.xml lines theme={null}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:maxLines="1"
        android:textAppearance="?attr/cometchatTextAppearanceHeading4Bold"
        android:textColor="?attr/cometchatTextColorPrimary" />

    <TextView
        android:id="@+id/tvSubtitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/cometchat_margin_1"
        android:textAppearance="?attr/cometchatTextAppearanceBodyRegular"
        android:textColor="?attr/cometchatTextColorSecondary" />
</LinearLayout>
```

> **What this does:** Defines a custom list item layout with two `TextView` elements: one for the member name and one for the subtitle (scope), arranged vertically.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin YourActivity.kt lines theme={null}
    cometchatGroupMembers.setItemView(object : GroupMembersViewHolderListeners() {
        override fun createView(
            context: Context?,
            listItem: CometchatGroupMemberListItemBinding?
        ): View {
            return View.inflate(context, R.layout.custom_group_list_item, null)
        }

        override fun bindView(
            context: Context,
            createdView: View,
            groupMember: GroupMember,
            group: Group,
            holder: RecyclerView.ViewHolder,
            groupMemberList: List<GroupMember>,
            position: Int
        ) {
            val tvName = createdView.findViewById<TextView>(R.id.tvName)
            val tvScope = createdView.findViewById<TextView>(R.id.tvSubtitle)
            tvName.text = groupMember.name
            tvScope.text = groupMember.scope
        }
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java YourActivity.java lines theme={null}
    cometchatGroupMembers.setItemView(new GroupMembersViewHolderListeners() {
        @Override
        public View createView(Context context, CometchatGroupMemberListItemBinding listItem) {
            return View.inflate(context, R.layout.custom_group_list_item, null);
        }

        @Override
        public void bindView(Context context, View createdView, GroupMember groupMember, Group group, RecyclerView.ViewHolder holder, List<GroupMember> groupMemberList, int position) {
            TextView tvName = createdView.findViewById(R.id.tvName);
            TextView tvScope = createdView.findViewById(R.id.tvSubtitle);
            tvName.setText(groupMember.getName());
            tvScope.setText(groupMember.getScope());
        }
    });
    ```
  </Tab>
</Tabs>

> **What this does:** Inflates a custom list item layout and populates it with the group member's name and scope. Each list item shows the member name in the primary text style and their scope (admin, moderator, participant) in the secondary text style.

### `setOptions`

Replace the long-press context menu entirely.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setOptions { context, groupMember, group -> emptyList<CometChatPopupMenu.MenuItem?>() }
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setOptions((context, groupMember, group) -> Collections.emptyList());
    ```
  </Tab>
</Tabs>

### `addOptions`

Append to the long-press context menu without removing defaults.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.addOptions { context, groupMember, group -> emptyList<CometChatPopupMenu.MenuItem?>() }
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.addOptions((context, groupMember, group) -> Collections.emptyList());
    ```
  </Tab>
</Tabs>

### `setLoadingStateView`

Sets a custom loading view displayed when data is being fetched.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setLoadingStateView(R.layout.your_loading_view)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setLoadingStateView(R.layout.your_loading_view);
    ```
  </Tab>
</Tabs>

### `setEmptyStateView`

Configures a custom view displayed when there are no group members in the list.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setEmptyStateView(R.layout.your_empty_view)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setEmptyStateView(R.layout.your_empty_view);
    ```
  </Tab>
</Tabs>

### `setErrorStateView`

Defines a custom error state view that appears when an issue occurs while loading group members.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setErrorStateView(R.layout.your_error_view)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setErrorStateView(R.layout.your_error_view);
    ```
  </Tab>
</Tabs>

### `setOverflowMenu`

Replace the toolbar overflow menu.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/8h5BHKu3EyYXR8p_/images/fb7e32ac-group_members_tail_view-19ea33e3931012467d4df750210007fe.png?fit=max&auto=format&n=8h5BHKu3EyYXR8p_&q=85&s=c9cec9c139fd87560bedaaea7b8390a5" width="1280" height="800" data-path="images/fb7e32ac-group_members_tail_view-19ea33e3931012467d4df750210007fe.png" />
</Frame>

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    val addMemberIv = ImageView(this)
    addMemberIv.setImageDrawable(ResourcesCompat.getDrawable(resources, R.drawable.ic_add, null))
    cometchatGroupMembers.setOverflowMenu(addMemberIv)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    ImageView addMemberIv = new ImageView(this);
    addMemberIv.setImageDrawable(ResourcesCompat.getDrawable(getResources(), R.drawable.ic_add, null));
    cometchatGroupMembers.setOverflowMenu(addMemberIv);
    ```
  </Tab>
</Tabs>

> **What this does:** Creates an `ImageView` with an add icon and sets it as the overflow menu in the group members toolbar. This provides a quick action button for adding new members.

* **Verify**: After setting any custom view slot, confirm the custom view renders in the correct position within the group member list item, and the data binding populates correctly for each member.

## Common Patterns

### Hide all chrome — minimal list

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setUserStatusVisibility(View.GONE)
    cometchatGroupMembers.setSeparatorVisibility(View.GONE)
    cometchatGroupMembers.setToolbarVisibility(View.GONE)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setUserStatusVisibility(View.GONE);
    cometchatGroupMembers.setSeparatorVisibility(View.GONE);
    cometchatGroupMembers.setToolbarVisibility(View.GONE);
    ```
  </Tab>
</Tabs>

### Admins-only list

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    val builder = GroupMembersRequest.GroupMembersRequestBuilder("GROUP_ID")
        .setScopes(listOf("admin"))
    cometchatGroupMembers.setGroupMembersRequestBuilder(builder)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    GroupMembersRequest.GroupMembersRequestBuilder builder = new GroupMembersRequest.GroupMembersRequestBuilder("GROUP_ID")
        .setScopes(Arrays.asList("admin"));
    cometchatGroupMembers.setGroupMembersRequestBuilder(builder);
    ```
  </Tab>
</Tabs>

### Exclude group owner

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.excludeOwner(true)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.excludeOwner(true);
    ```
  </Tab>
</Tabs>

### Hide kick/ban/scope options

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setKickMemberOptionVisibility(View.GONE)
    cometchatGroupMembers.setBanMemberOptionVisibility(View.GONE)
    cometchatGroupMembers.setScopeChangeOptionVisibility(View.GONE)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setKickMemberOptionVisibility(View.GONE);
    cometchatGroupMembers.setBanMemberOptionVisibility(View.GONE);
    cometchatGroupMembers.setScopeChangeOptionVisibility(View.GONE);
    ```
  </Tab>
</Tabs>

## Advanced Methods

### Programmatic Selection

#### `selectGroupMember`

Programmatically selects or deselects a group member. Works with both `SINGLE` and `MULTIPLE` selection modes.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    // Select a member in single-select mode
    cometchatGroupMembers.selectGroupMember(groupMember, UIKitConstants.SelectionMode.SINGLE)

    // Select a member in multi-select mode
    cometchatGroupMembers.selectGroupMember(groupMember, UIKitConstants.SelectionMode.MULTIPLE)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    // Select a member in single-select mode
    cometchatGroupMembers.selectGroupMember(groupMember, UIKitConstants.SelectionMode.SINGLE);

    // Select a member in multi-select mode
    cometchatGroupMembers.selectGroupMember(groupMember, UIKitConstants.SelectionMode.MULTIPLE);
    ```
  </Tab>
</Tabs>

> In `SINGLE` mode, selecting a new member replaces the previous selection. In `MULTIPLE` mode, calling this on an already-selected member deselects it (toggle behavior).

#### `getSelectedGroupMembers`

Returns the list of currently selected `GroupMember` objects.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    val selected = cometchatGroupMembers.selectedGroupMembers
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    List<GroupMember> selected = cometchatGroupMembers.getSelectedGroupMembers();
    ```
  </Tab>
</Tabs>

### Selected Group Members List

When using multi-select mode, a horizontal list of selected group members can be shown above the main list.

| Method                                     | Type                             | Description                               |
| ------------------------------------------ | -------------------------------- | ----------------------------------------- |
| `setSelectedGroupMembersListVisibility`    | `int (View.VISIBLE / View.GONE)` | Show or hide the selected members strip   |
| `setSelectedGroupMemberAvatarStyle`        | `@StyleRes int`                  | Avatar style for selected member chips    |
| `setSelectedGroupMemberItemTextColor`      | `@ColorInt int`                  | Text color for selected member names      |
| `setSelectedGroupMemberItemTextAppearance` | `@StyleRes int`                  | Text appearance for selected member names |
| `setSelectedGroupMemberItemRemoveIcon`     | `Drawable`                       | Icon for the remove button on each chip   |
| `setSelectedGroupMemberItemRemoveIconTint` | `@ColorInt int`                  | Tint color for the remove icon            |

### Search Input Customization

The built-in search box can be customized programmatically:

| Method                               | Type             | Description                           |
| ------------------------------------ | ---------------- | ------------------------------------- |
| `setSearchInputTextColor`            | `@ColorInt int`  | Text color of the search input        |
| `setSearchInputPlaceHolderTextColor` | `@ColorInt int`  | Placeholder text color                |
| `setSearchInputIcon`                 | `Drawable`       | Leading icon in the search box        |
| `setSearchInputIconTint`             | `@ColorInt int`  | Tint for the leading icon             |
| `setSearchInputEndIcon`              | `Drawable`       | Trailing icon in the search box       |
| `setSearchInputEndIconTint`          | `@ColorInt int`  | Tint for the trailing icon            |
| `setSearchInputStrokeWidth`          | `@Dimension int` | Stroke width of the search box border |
| `setSearchInputStrokeColor`          | `@ColorInt int`  | Stroke color of the search box border |
| `setSearchInputBackgroundColor`      | `@ColorInt int`  | Background color of the search box    |
| `setSearchInputCornerRadius`         | `@Dimension int` | Corner radius of the search box       |
| `setSearchInputTextAppearance`       | `@StyleRes int`  | Text appearance of the search input   |

### Internal Access

These methods provide direct access to internal components for advanced use cases.

| Method                            | Returns                                | Description                                        |
| --------------------------------- | -------------------------------------- | -------------------------------------------------- |
| `getBinding()`                    | `CometchatGroupMembersListViewBinding` | The ViewBinding for the component's root layout    |
| `getViewModel()`                  | `GroupMembersViewModel`                | The ViewModel managing group member data and state |
| `getAdapter()`                    | `GroupMembersAdapter`                  | The adapter powering the RecyclerView              |
| `setAdapter(GroupMembersAdapter)` | `void`                                 | Replaces the default adapter with a custom one     |
| `getRecyclerView()`               | `RecyclerView`                         | The RecyclerView displaying the member list        |

> Use these only when the standard API is insufficient. Directly manipulating the adapter or ViewModel may conflict with the component's internal state management.

## Style

The component uses XML theme styles. Define a custom style with parent `CometChatGroupMembersStyle` in `themes.xml`, then apply with `setStyle()`.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-feature-card-builder/cEj5TXvU_reIGZbk/images/1bd5a982-group_members_styling-ee7427e23be4ccf40776d8b1df1342f4.png?fit=max&auto=format&n=cEj5TXvU_reIGZbk&q=85&s=3af39b8b94d7fea8c8bc022d3bbed688" width="1280" height="800" data-path="images/1bd5a982-group_members_styling-ee7427e23be4ccf40776d8b1df1342f4.png" />
</Frame>

```xml themes.xml lines theme={null}
    <style name="CustomAvatarStyle" parent="CometChatAvatarStyle">
        <item name="cometchatAvatarStrokeRadius">8dp</item>
        <item name="cometchatAvatarBackgroundColor">#FBAA75</item>
    </style>

    <style name="CustomGroupMembersStyle" parent="CometChatGroupMembersStyle">
        <item name="cometchatGroupMembersAvatarStyle">@style/CustomAvatarStyle</item>
        <item name="cometchatGroupMembersSeparatorColor">#F76808</item>
        <item name="cometchatGroupMembersTitleTextColor">#F76808</item>
        <item name="cometchatGroupMembersBackIconTint">#F76808</item>
    </style>
```

<Tabs>
  <Tab title="Kotlin">
    ```kotlin lines theme={null}
    cometchatGroupMembers.setStyle(R.style.CustomGroupMembersStyle)
    ```
  </Tab>

  <Tab title="Java">
    ```java lines theme={null}
    cometchatGroupMembers.setStyle(R.style.CustomGroupMembersStyle);
    ```
  </Tab>
</Tabs>

> **What this does:** Applies the `CustomGroupMembersStyle` theme to the `CometChatGroupMembers` component, changing the avatar, separator, title text, and back icon appearance.

To know more such attributes, visit the [attributes file](https://github.com/cometchat/cometchat-uikit-android/blob/v5/chatuikit/src/main/res/values/attr_cometchat_group_members.xml).

### Programmatic Style Properties

In addition to XML theme styles, the component exposes programmatic setters for fine-grained control:

| Method                                | Type             | Description                                  |
| ------------------------------------- | ---------------- | -------------------------------------------- |
| `setBackgroundColor`                  | `@ColorInt int`  | Background color of the component            |
| `setBackIconTint`                     | `@ColorInt int`  | Tint color for the back icon                 |
| `setBackIcon`                         | `Drawable`       | Custom back icon drawable                    |
| `setTitleTextColor`                   | `@ColorInt int`  | Title text color in the toolbar              |
| `setTitleTextAppearance`              | `@StyleRes int`  | Title text appearance in the toolbar         |
| `setItemTitleTextColor`               | `@ColorInt int`  | Text color for member item titles            |
| `setItemTitleTextAppearance`          | `@StyleRes int`  | Text appearance for member item titles       |
| `setSeparatorColor`                   | `@ColorInt int`  | Color of list item separators                |
| `setSeparatorHeight`                  | `@Dimension int` | Height of list item separators               |
| `setCornerRadius`                     | `@Dimension int` | Corner radius of the component               |
| `setEmptyStateTitleTextColor`         | `@ColorInt int`  | Title text color for the empty state         |
| `setEmptyStateTitleTextAppearance`    | `@StyleRes int`  | Title text appearance for the empty state    |
| `setEmptyStateSubtitleTextColor`      | `@ColorInt int`  | Subtitle text color for the empty state      |
| `setEmptyStateSubtitleTextAppearance` | `@StyleRes int`  | Subtitle text appearance for the empty state |
| `setErrorStateTitleTextColor`         | `@ColorInt int`  | Title text color for the error state         |
| `setErrorStateTitleTextAppearance`    | `@StyleRes int`  | Title text appearance for the error state    |
| `setErrorStateSubtitleTextColor`      | `@ColorInt int`  | Subtitle text color for the error state      |
| `setErrorStateSubtitleTextAppearance` | `@StyleRes int`  | Subtitle text appearance for the error state |
| `setAvatarStyle`                      | `@StyleRes int`  | Style for member avatars                     |
| `setStatusIndicatorStyle`             | `@StyleRes int`  | Style for online/offline status indicators   |

### Checkbox Style Properties (Selection Mode)

When using `SINGLE` or `MULTIPLE` selection mode, checkboxes appear on each item:

| Method                              | Type             | Description                            |
| ----------------------------------- | ---------------- | -------------------------------------- |
| `setCheckBoxStrokeWidth`            | `@Dimension int` | Stroke width of the checkbox border    |
| `setCheckBoxCornerRadius`           | `@Dimension int` | Corner radius of the checkbox          |
| `setCheckBoxStrokeColor`            | `@ColorInt int`  | Stroke color of the checkbox border    |
| `setCheckBoxBackgroundColor`        | `@ColorInt int`  | Background color of unchecked checkbox |
| `setCheckBoxCheckedBackgroundColor` | `@ColorInt int`  | Background color of checked checkbox   |
| `setSelectIcon`                     | `Drawable`       | Icon shown when checkbox is checked    |
| `setSelectIconTint`                 | `@ColorInt int`  | Tint for the checkbox select icon      |
| `setDiscardSelectionIcon`           | `Drawable`       | Icon for the discard selection button  |
| `setDiscardSelectionIconTint`       | `@ColorInt int`  | Tint for the discard selection icon    |
| `setSubmitSelectionIcon`            | `Drawable`       | Icon for the submit selection button   |
| `setSubmitSelectionIconTint`        | `@ColorInt int`  | Tint for the submit selection icon     |

## Customization Matrix

| What to change                           | Where             | Property/API                                       | Example                                                            |
| ---------------------------------------- | ----------------- | -------------------------------------------------- | ------------------------------------------------------------------ |
| Override behavior on member interaction  | Activity/Fragment | `setOn<Event>` callbacks                           | `setOnItemClick((v, pos, m) -> { ... })`                           |
| Filter which members appear              | Activity/Fragment | `setGroupMembersRequestBuilder`                    | `setGroupMembersRequestBuilder(builder)`                           |
| Customize search results                 | Activity/Fragment | `setSearchRequestBuilder`                          | `setSearchRequestBuilder(builder)`                                 |
| Toggle visibility of UI elements         | Activity/Fragment | `set<Feature>Visibility(int)`                      | `setUserStatusVisibility(View.GONE)`                               |
| Replace a section of the list item       | Activity/Fragment | `set<Slot>View`                                    | `setLeadingView(listener)`                                         |
| Change colors, fonts, spacing            | `themes.xml`      | `CometChatGroupMembersStyle`                       | `<item name="cometchatGroupMembersSeparatorColor">#F76808</item>`  |
| Avatar style (corner radius, background) | `themes.xml`      | `cometchatGroupMembersAvatarStyle`                 | `<item name="cometchatAvatarStrokeRadius">8dp</item>`              |
| Apply a custom style                     | Activity/Fragment | `setStyle(int styleRes)`                           | `cometchatGroupMembers.setStyle(R.style.CustomGroupMembersStyle);` |
| Set the group                            | Activity/Fragment | `setGroup(Group)`                                  | `.setGroup(group);`                                                |
| Back button visibility                   | Activity/Fragment | `setBackIconVisibility(int)`                       | `.setBackIconVisibility(View.VISIBLE);`                            |
| Toolbar visibility                       | Activity/Fragment | `setToolbarVisibility(int)`                        | `.setToolbarVisibility(View.GONE);`                                |
| Error state visibility                   | Activity/Fragment | `setErrorStateVisibility(int)`                     | `.setErrorStateVisibility(View.GONE);`                             |
| Empty state visibility                   | Activity/Fragment | `setEmptyStateVisibility(int)`                     | `.setEmptyStateVisibility(View.GONE);`                             |
| Loading state visibility                 | Activity/Fragment | `setLoadingStateVisibility(int)`                   | `.setLoadingStateVisibility(View.GONE);`                           |
| Separator visibility                     | Activity/Fragment | `setSeparatorVisibility(int)`                      | `.setSeparatorVisibility(View.GONE);`                              |
| User online status visibility            | Activity/Fragment | `setUserStatusVisibility(int)`                     | `.setUserStatusVisibility(View.GONE);`                             |
| Selection mode (single/multiple)         | Activity/Fragment | `setSelectionMode(SelectionMode)`                  | `.setSelectionMode(UIKitConstants.SelectionMode.MULTIPLE);`        |
| Search keyword                           | Activity/Fragment | `setSearchKeyword(String)`                         | `.setSearchKeyword("anything");`                                   |
| Search box visibility                    | Activity/Fragment | `setSearchBoxVisibility(int)`                      | `.setSearchBoxVisibility(View.GONE);`                              |
| Custom toolbar title                     | Activity/Fragment | `setTitleText(String)`                             | `.setTitleText("Members");`                                        |
| Long-press options (replace)             | Activity/Fragment | `setOptions(Function3)`                            | See `setOptions` code above                                        |
| Long-press options (append)              | Activity/Fragment | `addOptions(Function3)`                            | See `addOptions` code above                                        |
| Loading view                             | Activity/Fragment | `setLoadingStateView(int)`                         | `.setLoadingStateView(R.layout.your_loading_view);`                |
| Empty view                               | Activity/Fragment | `setEmptyStateView(int)`                           | `.setEmptyStateView(R.layout.your_empty_view);`                    |
| Error view                               | Activity/Fragment | `setErrorStateView(int)`                           | `.setErrorStateView(R.layout.your_error_view);`                    |
| Leading view (avatar area)               | Activity/Fragment | `setLeadingView(GroupMembersViewHolderListeners)`  | See `setLeadingView` code above                                    |
| Title view                               | Activity/Fragment | `setTitleView(GroupMembersViewHolderListeners)`    | See `setTitleView` code above                                      |
| Subtitle view                            | Activity/Fragment | `setSubtitleView(GroupMembersViewHolderListeners)` | See `setSubtitleView` code above                                   |
| Trailing view                            | Activity/Fragment | `setTrailingView(GroupMembersViewHolderListeners)` | See `setTrailingView` code above                                   |
| Entire list item                         | Activity/Fragment | `setItemView(GroupMembersViewHolderListeners)`     | See `setItemView` code above                                       |
| Overflow menu                            | Activity/Fragment | `setOverflowMenu(View)`                            | `cometchatGroupMembers.setOverflowMenu(view);`                     |
| Kick member option visibility            | Activity/Fragment | `setKickMemberOptionVisibility(int)`               | `.setKickMemberOptionVisibility(View.GONE);`                       |
| Ban member option visibility             | Activity/Fragment | `setBanMemberOptionVisibility(int)`                | `.setBanMemberOptionVisibility(View.GONE);`                        |
| Scope change option visibility           | Activity/Fragment | `setScopeChangeOptionVisibility(int)`              | `.setScopeChangeOptionVisibility(View.GONE);`                      |
| Exclude group owner                      | Activity/Fragment | `excludeOwner(boolean)`                            | `.excludeOwner(true);`                                             |
| Programmatic selection                   | Activity/Fragment | `selectGroupMember(GroupMember, SelectionMode)`    | `.selectGroupMember(member, SelectionMode.SINGLE);`                |
| Selected members strip                   | Activity/Fragment | `setSelectedGroupMembersListVisibility(int)`       | `.setSelectedGroupMembersListVisibility(View.VISIBLE);`            |
| Internal adapter access                  | Activity/Fragment | `getAdapter()` / `setAdapter()`                    | Advanced use only                                                  |

## Next Steps

<CardGroup cols={2}>
  <Card title="Groups" icon="users" href="/ui-kit/android/groups">
    Browse and search available groups
  </Card>

  <Card title="Users" icon="user" href="/ui-kit/android/users">
    Browse and search available users
  </Card>

  <Card title="Conversations" icon="comments" href="/ui-kit/android/conversations">
    Browse recent conversations
  </Card>

  <Card title="Message List" icon="messages" href="/ui-kit/android/message-list">
    Display messages in a conversation
  </Card>
</CardGroup>
