stream-chat-android-compose/io.getstream.chat.android.compose.ui.channels.header/ChannelListHeader

ChannelListHeader

@Composable
fun ChannelListHeader(modifier: Modifier = Modifier, title: String = "", currentUser: User? = null, connectionState: ConnectionState, color: Color = ChatTheme.colors.barsBackground, shape: Shape = ChatTheme.shapes.header, elevation: Dp = ChatTheme.dimens.headerElevation, onAvatarClick: (User?) -> Unit = {}, onHeaderActionClick: () -> Unit = {}, leadingContent: @Composable RowScope.() -> Unit = { DefaultChannelHeaderLeadingContent( currentUser = currentUser, onAvatarClick = onAvatarClick, ) }, centerContent: @Composable RowScope.() -> Unit = { DefaultChannelListHeaderCenterContent( connectionState = connectionState, title = title, ) }, trailingContent: @Composable RowScope.() -> Unit = { DefaultChannelListHeaderTrailingContent( onHeaderActionClick = onHeaderActionClick, ) })

A clean, decoupled UI element that doesn't rely on ViewModels or our custom architecture setup. This allows the user to fully govern how the ChannelListHeader behaves, by passing in all the data that's required to display it and drive its actions.

Parameters

modifier

Modifier for styling.

title

The title to display, when the network is available.

currentUser

The currently logged in user, to load its image in the avatar.

connectionState

The state of WS connection used to switch between the title and the network loading view.

color

The color of the header.

shape

The shape of the header.

elevation

The elevation of the header.

onAvatarClick

Action handler when the user taps on an avatar.

onHeaderActionClick

Action handler when the user taps on the header action.

leadingContent

Custom composable that allows the user to replace the default header leading content. By default it shows a UserAvatar.

centerContent

Custom composable that allows the user to replace the default header center content. By default it either shows a text with title or connectionState.

trailingContent

Custom composable that allows the user to replace the default leading content. By default it shows an action icon.