Skip to main content
The CometChatCardBubble component is used to display a card within a chat bubble. The card includes an image, text, and action buttons. It helps to offer action-oriented chat experiences, like booking a flight, ordering food, scheduling a meeting, etc., directly in the chat.

​
Methods

MethodsParametersDescription
setCardMessageCardMessageAn instance of the CardMessage class which holds information about the card such as image URL, text, and action buttons.
setStyleCardBubbleStyleAn instance of the CardBubbleStyle class for customizing the appearance of the card bubble.

​
CardBubbleStyle

CardBubbleStyle is a class containing attributes to customize the appearance of the card in the CometChatCardBubble component.
MethodsTypeDescription
setBackground@ColorInt intUsed to set the background color of the card bubble.
setCornerRadiusflotUsed to set the corner radius of the card bubble.
setBorderWidthintUsed to set the Border width
setBorderColor@ColorInt intUsed to set the Border color
setTextAppearance@StyleRes intUsed to set the font style of the title. The object should include fontFamily, fontSize, and fontWeight.
setTextColor@ColorInt intUsed to set the color of the title.
setButtonBackgroundColorButtonStyleInterfaceUsed to customize the style of buttons.
setButtonTextColor@ColorInt intUsed to set Button text color.
setButtonTextAppearance@StyleRes intUsed to set Button text appearance
setContentBackgroundColor@ColorInt intUsed to set Content background color
setButtonSeparatorColor@ColorInt intUsed to set Button separator color
setProgressBarTintColor@ColorInt intUsed to set the color of the image in the card.
setQuickViewStyleQuickViewStyleUsed to set the QuickView style
setImageBubbleStyleImageBubbleStyleUsed to set how to resize the image in the card.

​
Usage

  • XML
<com.cometchat.chatuikit.shared.views.CometChatCardBubble.CometChatCardBubble
        android:id="@+id/cc_card_bubble"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="3dp" />
⌘I