Skip to main content


A Widget Dedicated To The Management Of A Channel List With Pagination.


Most widgets in the Core SDK are focused on fetching a particular type of object from Stream Chat - channels, messages, users, etc. The BLoC widgets bundle up the base functions used to fetch data as well as the current data fetched by the respective functions. Furthermore, the Core widgets use this BLoC to fetch new or existing data and build UI based on it.

All Core and UI widgets which focus on fetching a list of objects need to have their respective functions above them in the widget tree. The ChannelListCore and ChannelListView require the ChannelsBloc above them in the widget hierarchy without which they will fail.

Understanding The Widget#

ChannelsBloc is used together with ChannelListCore to manage a list of Channels with pagination, re-ordering, querying and other operations associated with Channels.

ChannelsBloc can be accessed at anytime by using the static .of method using Flutter's BuildContext.

var _channelsBloc = ChannelsBloc.of(context);

The ChannelsBloc widget encapsulates common functionality related to channel lists such as fetching the existing channels and querying new channels and also supplies them down the widget tree.

The widget is required for the respective core widget (ChannelListCore) to fetch channels and hence must be above the core widget in the tree.

Here is a basic implementation of ChannelsBloc:

ChannelsBloc(    child: // Further Widget Tree),

The ChannelsBloc widget allows three customisations:

Lock Channels Order#

ChannelsBloc may change the order of channels when new messages arrive. To lock this order, we can set the lockChannelsOrder property to true.

ChannelsBloc(    lockChannelsOrder: true,    child: // Further Widget Tree),

Set custom channel order#

We can decide the order of the channels in the list by supplying a comparator to the channelsComparator parameter:

ChannelsBloc(    channelsComparator: (a, b) {        return a.createdAt!.millisecondsSinceEpoch >                          b.createdAt!.millisecondsSinceEpoch                      ? 1                      : -1;    },    child: // Further Widget Tree),

Decide if channel should be added on new message event#

When a new message arrives, a event is received. We can decide if we want to add the channel to the list using the shouldAddChannel parameter which is a callback supplying the event data:

ChannelsBloc(    shouldAddChannel: (event) {        return event.message!.extraData['priority'] == '1';    },    child: // Further Widget Tree),

Did you find this page helpful?