Select your Platform:
Client SDKs
Backend SDKs
Message List Header View
Confused about "Message List Header View"?
Let us know how we can improve our documentation:
MessageListHeaderView displays useful information about the current channel. Typically it will show:
A back navigation button
Channel name
Number of members of a channel
Last time the channel was active
Online indicator about other users
Adding the layout
Copied!Confused about "Adding the layout"?
Let us know how we can improve our documentation:
Here's an example of the header being added to an XML layout:
1
2
3
4
5
6
7
<io.getstream.chat.android.ui.message.list.header.MessageListHeaderView
android:id="@+id/messagesHeaderView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />Binding With View Model
MessageListHeaderView comes with MessageListHeaderViewModel which is responsible for providing all needed data. The view can be bound with it using bindView:
1
2
3
4
5
// Get ViewModel
val factory: MessageListViewModelFactory = MessageListViewModelFactory(cid = "channelType:channelId")
val viewModel: MessageListHeaderViewModel by viewModels { factory }
// Bind it with MessageListHeaderView
viewModel.bindView(messageListHeaderView, viewLifecycleOwner)1
2
3
4
5
6
7
// Get ViewModel
MessageListViewModelFactory factory = new MessageListViewModelFactory("channelType:channelId");
MessageListHeaderViewModel viewModel =
new ViewModelProvider(this, factory).get(MessageListHeaderViewModel.class);
// Bind it with MessageListHeaderView
MessageListHeaderViewModelBinding
.bind(viewModel, messageListHeaderView, getViewLifecycleOwner());Handling User Interactions
Copied!Confused about "[object Object]"?
Let us know how we can improve our documentation:
MessageListHeaderView exposes multiple listeners for handling interactions with its components:
1
2
3
4
5
6
messageListHeaderView.setAvatarClickListener {
// Handle avatar click
}
messageListHeaderView.setTitleClickListener {
// Handle title click
}1
2
3
4
5
6
messageListHeaderView.setAvatarClickListener(() -> {
// Handle avatar click
});
messageListHeaderView.setTitleClickListener(() -> {
// Handle title click
});A full list of available listeners to set can be found here.
Customizations
Copied!Confused about "Customizations"?
Let us know how we can improve our documentation:
The view also gives you an opportunity to change component's visibility, fonts, or icons. The list of available attributes can be found here.