Merge pull request #568 from GetStream/hotfix/listBackground

fix(ui): list background

packages/stream_chat_flutter/lib/src/channel_list_view.dart

@@ -231,13 +231,21 @@ class _ChannelListViewState extends State<ChannelListView> {
       );
     }
 
-    return ColoredBox(
-      color: ChannelListViewTheme.of(context).backgroundColor!,
-      child: LazyLoadScrollView(
+    child = LazyLoadScrollView(
       onEndOfPage: () => _channelListController.paginateData!(),
       child: child,
-      ),
     );
+
+    final backgroundColor = ChannelListViewTheme.of(context).backgroundColor;
+
+    if (backgroundColor != null) {
+      return ColoredBox(
+        color: backgroundColor,
+        child: child,
+      );
+    }
+
+    return child;
   }
 
   Widget _buildListView(BuildContext context, List<Channel> channels) {

packages/stream_chat_flutter/lib/src/message_list_view.dart

@@ -386,9 +386,7 @@ class _MessageListViewState extends State<MessageListView> {
             1 // parent message
         ;
 
-    return ColoredBox(
-      color: MessageListViewTheme.of(context).backgroundColor!,
-      child: Stack(
+    final child = Stack(
       alignment: Alignment.center,
       children: [
         ConnectionStatusBuilder(
@@ -560,8 +558,7 @@ class _MessageListViewState extends State<MessageListView> {
                           const Offstage();
                     }
 
-                      const bottomMessageIndex =
-                          2; // 1 -> loader // 0 -> footer
+                    const bottomMessageIndex = 2; // 1 -> loader // 0 -> footer
 
                     final message = messages[i - 2];
                     Widget messageWidget;
@@ -588,8 +585,18 @@ class _MessageListViewState extends State<MessageListView> {
         if (widget.showFloatingDateDivider)
           _buildFloatingDateDivider(itemCount),
       ],
-      ),
     );
+
+    final backgroundColor = MessageListViewTheme.of(context).backgroundColor;
+
+    if (backgroundColor != null) {
+      return ColoredBox(
+        color: backgroundColor,
+        child: child,
+      );
+    }
+
+    return child;
   }
 
   Widget _buildThreadSeparator() {

packages/stream_chat_flutter/lib/src/message_search_list_view.dart

@@ -144,9 +144,8 @@ class _MessageSearchListViewState extends State<MessageSearchListView> {
       widget.messageSearchListController ?? _defaultController;
 
   @override
-  Widget build(BuildContext context) => ColoredBox(
-        color: MessageSearchListViewTheme.of(context).backgroundColor!,
-        child: MessageSearchListCore(
+  Widget build(BuildContext context) {
+    final messageSearchListCore = MessageSearchListCore(
       filters: widget.filters,
       sortOptions: widget.sortOptions,
       messageQuery: widget.messageQuery,
@@ -197,9 +196,21 @@ class _MessageSearchListViewState extends State<MessageSearchListView> {
                 ),
               ),
       childBuilder: widget.childBuilder ?? _buildListView,
-        ),
     );
 
+    final backgroundColor =
+        MessageSearchListViewTheme.of(context).backgroundColor;
+
+    if (backgroundColor != null) {
+      return ColoredBox(
+        color: backgroundColor,
+        child: messageSearchListCore,
+      );
+    }
+
+    return messageSearchListCore;
+  }
+
   Widget _separatorBuilder(BuildContext context, int index) => Container(
         height: 1,
         color: StreamChatTheme.of(context).colorTheme.borders,

packages/stream_chat_flutter/lib/src/user_list_view.dart

@@ -160,9 +160,7 @@ class _UserListViewState extends State<UserListView>
 
   @override
   Widget build(BuildContext context) {
-    final child = ColoredBox(
-      color: UserListViewTheme.of(context).backgroundColor!,
-      child: UserListCore(
+    final userListCore = UserListCore(
       errorBuilder: widget.errorBuilder ??
           (BuildContext context, Object err) => _buildError(err),
       emptyBuilder: widget.emptyBuilder ?? (context) => _buildEmpty(),
@@ -189,9 +187,21 @@ class _UserListViewState extends State<UserListView>
       presence: widget.presence,
       groupAlphabetically: widget.groupAlphabetically,
       userListController: _userListController,
-      ),
     );
 
+    final backgroundColor = UserListViewTheme.of(context).backgroundColor;
+
+    Widget child;
+
+    if (backgroundColor != null) {
+      child = ColoredBox(
+        color: backgroundColor,
+        child: userListCore,
+      );
+    } else {
+      child = userListCore;
+    }
+
     if (!widget.pullToRefresh) {
       return child;
     } else {