Flows (ChatFlows)

Only what is listed here

Below are all 8 flows in ChatFlows available for override. Internal properties of each flow are described in KDoc; the public contract includes only the flow classes themselves and their public var/val fields. For deeper customization, use ChatComponents (Components). Some ChatConfig parameters are controlled by server configuration — see Known limitations.

ChatFlows is the third level of the design system (after tokens and components). While ChatComponents defines global UI element styles, ChatFlows lets you override them for a single screen — for example, change the background only in the gallery without touching the main chat.

Concept

ChatColors / ChatImages / ChatTypography  ←  tokens (atomic values)
            │
            ▼
   ChatComponents                          ←  component styles (global)
            │
            ▼
   ChatFlows.{chatFlow, searchFlow, …}     ←  styles for a specific screen

Application priority: ChatFlows > ChatComponents > ChatColors/ChatImages/ChatTypography. In practice this works due to the initialization order (bottom-up): tokens → ChatComponents → ChatFlows. After ChatFlows is created, flow objects live independently: changes to ChatComponents are no longer picked up automatically — customize the flow fields directly.

Full list of flows

ChatFlows field	Type	Screen / context
chatFlow	ChatFlow	Main chat screen: messages, input, toolbar, welcome, statuses, pushes
searchFlow	SearchFlow	History search screen: search bar, loader, clear button
galleryFlow	GalleryFlow	"Media and files" list — image previews
filesFlow	FilesFlow	"Media and files" list — files section: names, sizes, dates, icons
imageFlow	ImageFlow	Full-screen image viewer: background, title, toolbar
popupsFlow	PopupsFlow	Pop-ups and alert dialogs: titles, text, background
balloonsChatStyle	BalloonsChatStyle	Toast/Snackbar notifications: text, background
bottomMenuChatFlow	BottomMenuChatFlow	Attachments menu: camera, files, gallery buttons

All 8 flow classes are data classes, and copy() works on them for partial overrides while preserving defaults.

Do not call copy() on ChatFlows itself

ChatFlows is also declared as a data class, but all 8 flow fields inside it are lateinit var outside the primary constructor and are initialized in the init block from ChatComponents. Therefore ChatFlows.copy() will not preserve your changes — the fields will be re-created from the components. Always customize via apply { ... } and copy() on individual flow objects — as in the examples below.

Deprecated BottomInputChatFlow

The BottomInputChatFlow class remains in the public API — it is marked @Deprecated for binary compatibility and is not used in the current SDK. For the attachments menu, work only with BottomMenuChatFlow.

Basic customization

val components = ChatComponents(applicationContext, colors = yourColors)
val flows = ChatFlows(components).apply {
    // Search customization
    // Note: SearchFlow.backgroundColor defaults to null — the search background
    // inherits from the chat. Set an explicit color to override.
    searchFlow = searchFlow.copy(
        backgroundColor = R.color.your_search_bg
    )

    // Full-screen image viewer customization (background — on GalleryFlow)
    galleryFlow = galleryFlow.copy(
        imageScreenBackgroundColor = R.color.black
    )

    // Placeholder customization on ImageFlow (avatars/outgoing/incoming)
    imageFlow = imageFlow.copy(
        imagePlaceholderResId = R.drawable.placeholder_image
    )

    // Files list customization
    filesFlow = filesFlow.copy(
        backgroundColor = R.color.your_files_bg
    )

    // Pop-up customization (alert/popup)
    popupsFlow = popupsFlow.copy(
        backgroundColor = R.color.your_popup_bg
    )

    // Attachments menu customization
    // Note: BottomMenuChatFlow.backgroundColor has an SDK default
    // (R.color.ecc_input_background) — for consistency with your theme,
    // set the color explicitly.
    bottomMenuChatFlow = bottomMenuChatFlow.copy(
        backgroundColor = R.color.your_menu_bg
    )
}

val theme = ChatTheme(flows)
chatCenterUI.theme = theme

Main screen customization via chatFlow

chatFlow is the "fattest" flow with dozens of fields. Used to customize the toolbar, bubbles, input field, etc. on the main screen.

val flows = ChatFlows(components).apply {
    chatFlow = chatFlow.copy(
        // background, separators
        backgroundColor = R.color.your_chat_bg,
        separatorsColor = R.color.your_separator
    )

    // Per-element substitution of objects inside InputViewStyle / WelcomeScreenStyle:
    // get the current object, copy with the needed fields, and assign it back.
    chatFlow.inputView = chatFlow.inputView.copy(
        textInput = chatFlow.inputView.textInput?.copy(
            placeholderTextResId = R.string.your_input_hint
        )
    )
    chatFlow.welcomeScreenStyle = chatFlow.welcomeScreenStyle.copy(
        backgroundColor = R.color.your_welcome_bg
    )
}

A detailed description of ChatFlow and its 30+ fields (message styles, toolbar, input, quotes, surveys) is in Components and the KDoc of the ChatFlow class in the SDK sources.

ChatFlow.fullScreenMode is deprecated

The fullScreenMode parameter in ChatFlow is marked @Deprecated for targetSdk = 35. The SDK always works in edge-to-edge mode. See Known limitations.

Related sections

• Design system: introduction — overview of customization levels.
• Themes — ChatComponents, ChatTheme, ready-made theme examples.
• Components — detailed description of ChatComponents (one of the sources of flow defaults).
• Colors, Typography, Images — tokens at the foundation of flows.
• Known limitations — parameters with server priority and behavioral notes (including ChatFlow.fullScreenMode).