Skip to main content
Text formatters let you process message text with tracking characters, suggestion lists, and spannable transformations. Use them to add hashtag detection, custom mentions, link previews, or any text pattern processing.

CometChatTextFormatter

The CometChatTextFormatter abstract class is the base for all formatters. Its constructor takes a char trackingCharacter that triggers the formatter when typed in the composer (e.g., @ for mentions, # for hashtags).

Key Override Methods

MethodPurpose
search(Context, String)Called when the user types after the tracking character. Use this to fetch and display suggestions.
onScrollToBottom()Called when the user scrolls to the bottom of the suggestion list. Use for pagination.
prepareLeftMessageBubbleSpan(Context, BaseMessage, SpannableStringBuilder)Apply spans to text in received (left) message bubbles.
prepareRightMessageBubbleSpan(Context, BaseMessage, SpannableStringBuilder)Apply spans to text in sent (right) message bubbles.
prepareComposerSpan(Context, BaseMessage, SpannableStringBuilder)Apply spans to text in the message composer.
prepareConversationSpan(Context, BaseMessage, SpannableStringBuilder)Apply spans to the last message preview in the conversations list.

Pre-Send Hook

Override handlePreMessageSend(Context, BaseMessage) to modify a message before it’s sent. This is useful for attaching metadata, transforming text, or adding custom data to the message object.

Suggestion System

The formatter provides a built-in suggestion dropdown:
MethodDescription
setSuggestionItemList(List<SuggestionItem>)Set the list of suggestions to display
setShowLoadingIndicator(boolean)Show/hide a loading spinner in the suggestion dropdown
setDisableSuggestions(boolean)Disable the suggestion dropdown entirely
onItemClick(Context, SuggestionItem, User, Group)Called when the user selects a suggestion item

Example: Custom Hashtag Formatter

class HashtagFormatter : CometChatTextFormatter('#') {

    override fun search(context: Context, queryString: String?) {
        // Fetch hashtag suggestions based on query
        val suggestions = fetchHashtags(queryString)
        setSuggestionItemList(suggestions)
    }

    override fun onScrollToBottom() {
        // Load more suggestions
    }

    override fun prepareLeftMessageBubbleSpan(
        context: Context,
        baseMessage: BaseMessage,
        spannable: SpannableStringBuilder
    ): SpannableStringBuilder? {
        // Apply blue color to #hashtags in received messages
        applyHashtagSpans(spannable, context)
        return spannable
    }

    override fun prepareRightMessageBubbleSpan(
        context: Context,
        baseMessage: BaseMessage,
        spannable: SpannableStringBuilder
    ): SpannableStringBuilder? {
        // Apply blue color to #hashtags in sent messages
        applyHashtagSpans(spannable, context)
        return spannable
    }

    override fun prepareComposerSpan(
        context: Context,
        baseMessage: BaseMessage,
        spannable: SpannableStringBuilder
    ): SpannableStringBuilder? {
        applyHashtagSpans(spannable, context)
        return spannable
    }

    override fun prepareConversationSpan(
        context: Context,
        baseMessage: BaseMessage,
        spannable: SpannableStringBuilder
    ): SpannableStringBuilder? {
        applyHashtagSpans(spannable, context)
        return spannable
    }
}

Registering Formatters

Register formatters on a component using setTextFormatters:
val hashtagFormatter = HashtagFormatter()
conversations.setTextFormatters(listOf(hashtagFormatter))

Built-in Formatter: CometChatMentionsFormatter

The UI Kit includes CometChatMentionsFormatter as a built-in formatter that handles @mention detection, user suggestion lists, and spannable highlighting. It serves as a reference implementation for building custom formatters. See the Mentions Formatter Guide for details.

Global Configuration via DataSource

Formatters can also be configured globally using the DataSource framework. Override getTextFormatters in a DataSourceDecorator to add formatters that apply across all components:
class CustomDataSource(dataSource: DataSource) : DataSourceDecorator(dataSource) {
    override fun getTextFormatters(context: Context, additionParameter: AdditionParameter): List<CometChatTextFormatter> {
        val formatters = super.getTextFormatters(context, additionParameter).toMutableList()
        formatters.add(HashtagFormatter())
        return formatters
    }
}

// Register globally
ChatConfigurator.enable { dataSource -> CustomDataSource(dataSource) }