Customize channel item UI

A channel list shows a complete list of group channels that the current user is a member of. You can customize the channel list UI by creating a new ViewHolder. For a list of properties available for each channel item, refer to the API reference page.

You can draw new channel items by inheriting from the ChannelListAdapter. This works in the same way as the Android's RecyclerView. First, create a ViewHolder to contain your custom view. This ViewHolder is responsible for creating and binding your custom UI components based on the channel data it receives. Within your custom adapter, override the onCreateViewHolder to return your new ViewHolder. When bind(channel: GroupChannel) is called, this is where you can draw or update the custom channel item UI.

class CustomChannelListAdapter : ChannelListAdapter() {

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): BaseViewHolder<GroupChannel> {
        // create new custom ViewHolder
        return CustomChannelPreviewHolder(ViewChannelListItemPreviewBinding.inflate(LayoutInflater.from(parent.context), parent, false))
    }

    private class CustomChannelPreviewHolder(private val binding: ViewChannelListItemPreviewBinding) : BaseViewHolder<GroupChannel>(binding.getRoot()) {
        override fun bind(channel: GroupChannel) {
            // Draw your customize channel item here.
        }
    }
}

For information on how to apply custom adapters, see this page.

Additionally, for an in-depth practical demonstration, see our sample code.