Call Buttons - CometChat Docs

AI Agent Component Spec

{
  "component": "CometChatCallButtons",
  "package": "com.cometchat.chatuikit.calls.callbutton",
  "xmlElement": "<com.cometchat.chatuikit.calls.callbutton.CometChatCallButtons />",
  "description": "Voice and video call buttons that initiate calls for a given user or group.",
  "primaryOutput": {
    "method": "setOnVoiceCallClick / setOnVideoCallClick",
    "type": "OnClick"
  },
  "methods": {
    "data": {
      "setUser": {
        "type": "User",
        "default": "null",
        "note": "Sets the user to call. Required for 1-on-1 calls."
      },
      "setGroup": {
        "type": "Group",
        "default": "null",
        "note": "Sets the group to call. Required for group calls."
      }
    },
    "callbacks": {
      "setOnVoiceCallClick": "OnClick — void onClick(User user, Group group)",
      "setOnVideoCallClick": "OnClick — void onClick(User user, Group group)"
    },
    "visibility": {
      "setVoiceCallButtonVisibility": { "type": "int (View.VISIBLE | View.GONE)", "default": "View.VISIBLE" },
      "setVideoCallButtonVisibility": { "type": "int (View.VISIBLE | View.GONE)", "default": "View.VISIBLE" },
      "setButtonTextVisibility": { "type": "int (View.VISIBLE | View.GONE)", "default": "View.VISIBLE" },
      "setButtonIconVisibility": { "type": "int (View.VISIBLE | View.GONE)", "default": "View.VISIBLE" }
    },
    "viewSlots": {
      "getVoiceCallButton": "CometChatButton — direct access to the voice call button for customization",
      "getVideoCallButton": "CometChatButton — direct access to the video call button for customization"
    },
    "advanced": {
      "setOutgoingCallConfiguration": "OutgoingCallConfiguration — configures the outgoing call screen",
      "setCallSettingsBuilder": "Function3<User, Group, Boolean, CometChatCalls.CallSettingsBuilder> — custom call settings per call type",
      "setMarginBetweenButtons": "@Dimension int — spacing between voice and video buttons",
      "setVoiceButtonText": "String — custom text for the voice call button",
      "setVideoButtonText": "String — custom text for the video call button",
      "disposeObservers": "void — removes lifecycle observers"
    },
    "style": {
      "setStyle": {
        "type": "@StyleRes int",
        "parent": "CometChatCallButtonsStyle"
      }
    }
  },
  "events": [
    {
      "name": "CometChatCallEvents.ccOutgoingCall",
      "payload": "Call",
      "description": "An outgoing call was initiated"
    },
    {
      "name": "CometChatCallEvents.ccCallAccepted",
      "payload": "Call",
      "description": "A call was accepted by the recipient"
    },
    {
      "name": "CometChatCallEvents.ccCallRejected",
      "payload": "Call",
      "description": "A call was rejected by the recipient"
    },
    {
      "name": "CometChatCallEvents.ccCallEnded",
      "payload": "Call",
      "description": "A call was ended"
    }
  ],
  "sdkListeners": []
}

Where It Fits

CometChatCallButtons is a utility component. It renders voice and video call buttons and initiates calls for the bound User or Group. Wire it into a CometChatMessageHeader or place it anywhere a call action is needed.

Kotlin
Java

ChatActivity.kt

class ChatActivity : AppCompatActivity() {

    private lateinit var messageHeader: CometChatMessageHeader
    private lateinit var callButtons: CometChatCallButtons

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

        messageHeader = findViewById(R.id.message_header)
        callButtons = findViewById(R.id.call_buttons)

        // Bind the same user to both components
        val user: User = intent.getParcelableExtra("user")!!
        messageHeader.setUser(user)
        callButtons.setUser(user)
    }
}

ChatActivity.java

public class ChatActivity extends AppCompatActivity {

    private CometChatMessageHeader messageHeader;
    private CometChatCallButtons callButtons;

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

        messageHeader = findViewById(R.id.message_header);
        callButtons = findViewById(R.id.call_buttons);

        // Bind the same user to both components
        User user = getIntent().getParcelableExtra("user");
        messageHeader.setUser(user);
        callButtons.setUser(user);
    }
}

Quick Start

Add the component to your layout XML:

layout_activity.xml

<com.cometchat.chatuikit.calls.callbutton.CometChatCallButtons
        android:id="@+id/call_buttons"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

Prerequisites: CometChat SDK initialized with CometChatUIKit.init(), a user logged in, and the cometchat-chat-uikit-android dependency added. To add programmatically in an Activity:

Kotlin
Java

YourActivity.kt

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val callButtons = CometChatCallButtons(this)
    callButtons.setUser(user)
    setContentView(callButtons)
}

YourActivity.java

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    CometChatCallButtons callButtons = new CometChatCallButtons(this);
    callButtons.setUser(user);
    setContentView(callButtons);
}

Or in a Fragment:

Kotlin
Java

YourFragment.kt

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
    val callButtons = CometChatCallButtons(requireContext())
    callButtons.setUser(user)
    return callButtons
}

YourFragment.java

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    CometChatCallButtons callButtons = new CometChatCallButtons(getContext());
    callButtons.setUser(user);
    return callButtons;
}

You must call setUser(User) or setGroup(Group) before the buttons can initiate a call. Without a target, button clicks have no effect.

Actions and Events

Callback Methods

`setOnVoiceCallClick`

Fires when the voice call button is tapped. Replaces the default behavior of initiating an audio call.

Kotlin
Java

YourActivity.kt

callButtons.setOnVoiceCallClick { user, group ->
    // Custom voice call logic
}

YourActivity.java

callButtons.setOnVoiceCallClick((user, group) -> {
    // Custom voice call logic
});

What this does: Replaces the default voice call initiation. When a user taps the voice call button, your custom lambda executes instead of the built-in call flow. The OnClick interface provides void onClick(User user, Group group).

`setOnVideoCallClick`

Fires when the video call button is tapped. Replaces the default behavior of initiating a video call.

Kotlin
Java

YourActivity.kt

callButtons.setOnVideoCallClick { user, group ->
    // Custom video call logic
}

YourActivity.java

callButtons.setOnVideoCallClick((user, group) -> {
    // Custom video call logic
});

Verify: After setting a callback, tap the corresponding button and confirm your custom logic executes instead of the default call initiation.

Global UI Events (CometChatCallEvents)

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

Event	Fires when	Payload
`ccOutgoingCall`	An outgoing call is initiated	`Call`
`ccCallAccepted`	A call is accepted by the recipient	`Call`
`ccCallRejected`	A call is rejected by the recipient	`Call`
`ccCallEnded`	A call is ended	`Call`

Kotlin
Java

Add Listener

CometChatCallEvents.addListener("CALL_LISTENER_TAG", object : CometChatCallEvents() {
    override fun ccOutgoingCall(call: Call?) {
        super.ccOutgoingCall(call)
    }

    override fun ccCallAccepted(call: Call?) {
        super.ccCallAccepted(call)
    }

    override fun ccCallRejected(call: Call?) {
        super.ccCallRejected(call)
    }

    override fun ccCallEnded(call: Call?) {
        super.ccCallEnded(call)
    }
})

Remove Listener

CometChatCallEvents.removeListener("CALL_LISTENER_TAG")

Add Listener

CometChatCallEvents.addListener("CALL_LISTENER_TAG", new CometChatCallEvents() {
    @Override
    public void ccOutgoingCall(Call call) {
        super.ccOutgoingCall(call);
    }

    @Override
    public void ccCallAccepted(Call call) {
        super.ccCallAccepted(call);
    }

    @Override
    public void ccCallRejected(Call call) {
        super.ccCallRejected(call);
    }

    @Override
    public void ccCallEnded(Call call) {
        super.ccCallEnded(call);
    }
});

Remove Listener

CometChatCallEvents.removeListener("CALL_LISTENER_TAG");

SDK Events

The component uses an internal CallButtonsViewModel that observes call initiation and direct call events. No manual SDK listener attachment is needed — the component handles call lifecycle internally.

Functionality

Small functional customizations such as toggling visibility of UI elements and configuring button spacing.

Method	Description	Code
`setVoiceCallButtonVisibility`	Toggles visibility of the voice call button	`.setVoiceCallButtonVisibility(View.GONE);`
`setVideoCallButtonVisibility`	Toggles visibility of the video call button	`.setVideoCallButtonVisibility(View.GONE);`
`setButtonTextVisibility`	Toggles visibility of text labels on both buttons	`.setButtonTextVisibility(View.GONE);`
`setButtonIconVisibility`	Toggles visibility of icons on both buttons	`.setButtonIconVisibility(View.GONE);`
`setMarginBetweenButtons`	Sets the spacing between voice and video buttons	`.setMarginBetweenButtons(24);`

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

Custom View Slots

CometChatCallButtons exposes direct access to its two internal CometChatButton instances. Use these to customize icons, text, colors, and other properties on each button individually.

Slot	Method	Returns
Voice call button	`getVoiceCallButton()`	`CometChatButton`
Video call button	`getVideoCallButton()`	`CometChatButton`

Kotlin
Java

// Access the voice call button and customize it
val voiceBtn = callButtons.getVoiceCallButton()
voiceBtn.setButtonText("Audio")

// Access the video call button and customize it
val videoBtn = callButtons.getVideoCallButton()
videoBtn.setButtonText("Video")

// Access the voice call button and customize it
CometChatButton voiceBtn = callButtons.getVoiceCallButton();
voiceBtn.setButtonText("Audio");

// Access the video call button and customize it
CometChatButton videoBtn = callButtons.getVideoCallButton();
videoBtn.setButtonText("Video");

Verify: After accessing a button via getVoiceCallButton() or getVideoCallButton(), confirm your customizations render correctly on the corresponding button.

Common Patterns

Video-only buttons

Kotlin
Java

callButtons.setVoiceCallButtonVisibility(View.GONE)

callButtons.setVoiceCallButtonVisibility(View.GONE);

Voice-only buttons

Kotlin
Java

callButtons.setVideoCallButtonVisibility(View.GONE)

callButtons.setVideoCallButtonVisibility(View.GONE);

Custom button text

Kotlin
Java

callButtons.setVoiceButtonText("Audio Call")
callButtons.setVideoButtonText("Video Call")

callButtons.setVoiceButtonText("Audio Call");
callButtons.setVideoButtonText("Video Call");

Icon-only buttons

Kotlin
Java

callButtons.setButtonTextVisibility(View.GONE)

callButtons.setButtonTextVisibility(View.GONE);

Advanced Methods

`setUser` / `setGroup`

Binds the component to a specific user or group. Required before calls can be initiated.

Kotlin
Java

// For 1-on-1 calls
callButtons.setUser(user)

// For group calls
callButtons.setGroup(group)

// For 1-on-1 calls
callButtons.setUser(user);

// For group calls
callButtons.setGroup(group);

`setOutgoingCallConfiguration`

Configures the outgoing call screen that appears after a call is initiated.

Kotlin
Java

val config = OutgoingCallConfiguration()
callButtons.setOutgoingCallConfiguration(config)

OutgoingCallConfiguration config = new OutgoingCallConfiguration();
callButtons.setOutgoingCallConfiguration(config);

`setCallSettingsBuilder`

Provides a callback to customize call settings per call. The callback receives the User, Group, and a Boolean indicating whether the call is audio (true) or video (false), and returns a CometChatCalls.CallSettingsBuilder.

Kotlin
Java

callButtons.setCallSettingsBuilder { user, group, isAudio ->
    CometChatCalls.CallSettingsBuilder(this, true)
        .setIsAudioOnly(isAudio)
}

callButtons.setCallSettingsBuilder((user, group, isAudio) -> {
    return new CometChatCalls.CallSettingsBuilder(this, true)
        .setIsAudioOnly(isAudio);
});

`getVoiceCallButton` / `getVideoCallButton`

Returns the internal CometChatButton instances for direct customization.

Method	Returns	Description
`getVoiceCallButton()`	`CometChatButton`	The voice call button instance
`getVideoCallButton()`	`CometChatButton`	The video call button instance

`disposeObservers`

Removes lifecycle observers manually. Normally handled automatically when the view detaches from the window.

Kotlin
Java

callButtons.disposeObservers()

callButtons.disposeObservers();

Style

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

themes.xml

<style name="CustomCallButtonsStyle" parent="CometChatCallButtonsStyle">
    <item name="cometchatCallButtonsVoiceCallIconTint">#4CAF50</item>
    <item name="cometchatCallButtonsVideoCallIconTint">#2196F3</item>
    <item name="cometchatCallButtonsVoiceCallBackgroundColor">#E8F5E9</item>
    <item name="cometchatCallButtonsVideoCallBackgroundColor">#E3F2FD</item>
    <item name="cometchatCallButtonsMarginBetween">16dp</item>
</style>

Kotlin
Java

callButtons.setStyle(R.style.CustomCallButtonsStyle)

callButtons.setStyle(R.style.CustomCallButtonsStyle);

Programmatic Style Properties

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

Method	Type	Description
`setVoiceCallIcon`	`Drawable`	Icon drawable for the voice call button
`setVideoCallIcon`	`Drawable`	Icon drawable for the video call button
`setVoiceCallIconTint`	`@ColorInt int`	Tint color for the voice call icon
`setVideoCallIconTint`	`@ColorInt int`	Tint color for the video call icon
`setVoiceCallTextColor`	`@ColorInt int`	Text color for the voice call button
`setVideoCallTextColor`	`@ColorInt int`	Text color for the video call button
`setVoiceCallTextAppearance`	`@StyleRes int`	Text appearance for the voice call button
`setVideoCallTextAppearance`	`@StyleRes int`	Text appearance for the video call button
`setVoiceCallBackgroundColor`	`@ColorInt int`	Background color for the voice call button
`setVideoCallBackgroundColor`	`@ColorInt int`	Background color for the video call button
`setVoiceCallCornerRadius`	`@Dimension int`	Corner radius for the voice call button
`setVideoCallCornerRadius`	`@Dimension int`	Corner radius for the video call button
`setVoiceCallIconSize`	`@Dimension int`	Icon size for the voice call button
`setVideoCallIconSize`	`@Dimension int`	Icon size for the video call button
`setVoiceCallStrokeWidth`	`@Dimension int`	Stroke width for the voice call button
`setVideoCallStrokeWidth`	`@Dimension int`	Stroke width for the video call button
`setVoiceCallStrokeColor`	`@ColorInt int`	Stroke color for the voice call button
`setVideoCallStrokeColor`	`@ColorInt int`	Stroke color for the video call button
`setVoiceCallButtonPadding`	`@Dimension int`	Padding for the voice call button
`setVideoCallButtonPadding`	`@Dimension int`	Padding for the video call button

Customization Matrix

What to change	Where	Property/API	Example
Override voice call tap behavior	Activity/Fragment	`setOnVoiceCallClick`	`setOnVoiceCallClick((u, g) -> { ... })`
Override video call tap behavior	Activity/Fragment	`setOnVideoCallClick`	`setOnVideoCallClick((u, g) -> { ... })`
Hide voice call button	Activity/Fragment	`setVoiceCallButtonVisibility(int)`	`setVoiceCallButtonVisibility(View.GONE)`
Hide video call button	Activity/Fragment	`setVideoCallButtonVisibility(int)`	`setVideoCallButtonVisibility(View.GONE)`
Hide button text labels	Activity/Fragment	`setButtonTextVisibility(int)`	`setButtonTextVisibility(View.GONE)`
Hide button icons	Activity/Fragment	`setButtonIconVisibility(int)`	`setButtonIconVisibility(View.GONE)`
Change button spacing	Activity/Fragment	`setMarginBetweenButtons(int)`	`setMarginBetweenButtons(24)`
Set custom button text	Activity/Fragment	`setVoiceButtonText` / `setVideoButtonText`	`setVoiceButtonText("Audio Call")`
Change voice call icon	Activity/Fragment	`setVoiceCallIcon(Drawable)`	`setVoiceCallIcon(drawable)`
Change video call icon	Activity/Fragment	`setVideoCallIcon(Drawable)`	`setVideoCallIcon(drawable)`
Change icon tint colors	Activity/Fragment	`setVoiceCallIconTint` / `setVideoCallIconTint`	`setVoiceCallIconTint(Color.GREEN)`
Change text colors	Activity/Fragment	`setVoiceCallTextColor` / `setVideoCallTextColor`	`setVoiceCallTextColor(Color.BLACK)`
Change background colors	Activity/Fragment	`setVoiceCallBackgroundColor` / `setVideoCallBackgroundColor`	`setVoiceCallBackgroundColor(Color.WHITE)`
Change corner radius	Activity/Fragment	`setVoiceCallCornerRadius` / `setVideoCallCornerRadius`	`setVoiceCallCornerRadius(16)`
Change icon size	Activity/Fragment	`setVoiceCallIconSize` / `setVideoCallIconSize`	`setVoiceCallIconSize(48)`
Change stroke width	Activity/Fragment	`setVoiceCallStrokeWidth` / `setVideoCallStrokeWidth`	`setVoiceCallStrokeWidth(2)`
Change stroke color	Activity/Fragment	`setVoiceCallStrokeColor` / `setVideoCallStrokeColor`	`setVoiceCallStrokeColor(Color.GRAY)`
Change button padding	Activity/Fragment	`setVoiceCallButtonPadding` / `setVideoCallButtonPadding`	`setVoiceCallButtonPadding(12)`
Apply XML theme style	`themes.xml`	`CometChatCallButtonsStyle`	`<item name="cometchatCallButtonsVoiceCallIconTint">#4CAF50</item>`
Apply style programmatically	Activity/Fragment	`setStyle(int styleRes)`	`callButtons.setStyle(R.style.CustomCallButtonsStyle)`
Configure outgoing call screen	Activity/Fragment	`setOutgoingCallConfiguration`	`setOutgoingCallConfiguration(config)`
Custom call settings per call	Activity/Fragment	`setCallSettingsBuilder`	See `setCallSettingsBuilder` code above
Access internal buttons	Activity/Fragment	`getVoiceCallButton()` / `getVideoCallButton()`	`callButtons.getVoiceCallButton()`

Accessibility

The component renders two CometChatButton instances inside a MaterialCardView. Each button responds to tap gestures. The voice and video call icons include default content descriptions for screen readers. For custom icons set via setVoiceCallIcon or setVideoCallIcon, ensure you set android:contentDescription on the drawable or on the button view so TalkBack can announce the action. The default icons handle this automatically. Button text labels (when visible) provide additional context for assistive technologies. If you hide text with setButtonTextVisibility(View.GONE), consider adding explicit content descriptions to the buttons via getVoiceCallButton().setContentDescription(...).

Next Steps

Call Logs

View call history

Message Header

Display user/group info in the toolbar

Conversations

Browse recent conversations

Incoming Call

Incoming call notification with accept/reject

​Where It Fits

​Quick Start

​Actions and Events

​Callback Methods

​setOnVoiceCallClick

​setOnVideoCallClick

​Global UI Events (CometChatCallEvents)

​SDK Events

​Functionality

​Custom View Slots

​Common Patterns

​Video-only buttons

​Voice-only buttons

​Custom button text

​Icon-only buttons

​Advanced Methods

​setUser / setGroup

​setOutgoingCallConfiguration

​setCallSettingsBuilder

​getVoiceCallButton / getVideoCallButton

​disposeObservers

​Style

​Programmatic Style Properties

​Customization Matrix

​Accessibility

​Next Steps

Call Logs

Message Header

Conversations

Incoming Call

Where It Fits

Quick Start

Actions and Events

Callback Methods

`setOnVoiceCallClick`

`setOnVideoCallClick`

Global UI Events (CometChatCallEvents)

SDK Events

Functionality

Custom View Slots

Common Patterns

Video-only buttons

Voice-only buttons

Custom button text

Icon-only buttons

Advanced Methods

`setUser` / `setGroup`

`setOutgoingCallConfiguration`

`setCallSettingsBuilder`

`getVoiceCallButton` / `getVideoCallButton`

`disposeObservers`

Style

Programmatic Style Properties

Customization Matrix

Accessibility

Next Steps