apply theme to new chat screens

example/lib/advanced_options_page.dart

@@ -34,6 +34,7 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       resizeToAvoidBottomPadding: false,
       appBar: AppBar(
         backgroundColor: StreamChatTheme.of(context).colorTheme.white,
@@ -107,7 +108,8 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                         borderRadius: BorderRadius.circular(8),
                         borderSide: BorderSide.none,
                       ),
-                      fillColor: Color(0xffF5F5F5),
+                      fillColor:
+                          StreamChatTheme.of(context).colorTheme.whiteSmoke,
                       filled: true,
                       labelText:
                           'Chat API Key ${_apiKeyError != null ? ':$_apiKeyError' : ''}',
@@ -155,7 +157,8 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                           borderRadius: BorderRadius.circular(8),
                           borderSide: BorderSide.none,
                         ),
-                        fillColor: Color(0xffF5F5F5),
+                        fillColor:
+                            StreamChatTheme.of(context).colorTheme.whiteSmoke,
                         filled: true,
                         labelText:
                             'User ID ${_userIdError != null ? ':$_userIdError' : ''}',
@@ -203,7 +206,8 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                           borderRadius: BorderRadius.circular(8),
                           borderSide: BorderSide.none,
                         ),
-                        fillColor: Color(0xffF5F5F5),
+                        fillColor:
+                            StreamChatTheme.of(context).colorTheme.whiteSmoke,
                         filled: true,
                         labelText:
                             'User Token ${_userTokenError != null ? ':$_userTokenError' : ''}',
@@ -228,7 +232,8 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                           borderRadius: BorderRadius.circular(8),
                           borderSide: BorderSide.none,
                         ),
-                        fillColor: Color(0xffF5F5F5),
+                        fillColor:
+                            StreamChatTheme.of(context).colorTheme.whiteSmoke,
                         filled: true,
                         labelText: 'Username (optional)',
                       ),

example/lib/choose_user_page.dart

@@ -58,6 +58,7 @@ class ChooseUserPage extends StatelessWidget {
         (_, value) => value..extraData['image'] = getRandomPicUrl(value));
 
     return Scaffold(
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       body: SafeArea(
         child: Column(
           crossAxisAlignment: CrossAxisAlignment.center,
@@ -191,8 +192,9 @@ class ChooseUserPage extends StatelessWidget {
                           child: StreamSvgIcon.settings(
                             color: StreamChatTheme.of(context).colorTheme.black,
                           ),
-                          backgroundColor:
+                          backgroundColor: StreamChatTheme.of(context)
-                              StreamChatTheme.of(context).colorTheme.accentBlue,
+                              .colorTheme
+                              .greyWhisper,
                         ),
                         title: Text(
                           'Advanced Options',

example/lib/group_chat_details_screen.dart

@@ -59,7 +59,7 @@ class _GroupChatDetailsScreenState extends State<GroupChatDetailsScreen> {
         return false;
       },
       child: Scaffold(
-        backgroundColor: Color.fromRGBO(252, 252, 252, 1),
+        backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
         appBar: AppBar(
           elevation: 1,
           backgroundColor: StreamChatTheme.of(context).colorTheme.white,
@@ -151,7 +151,16 @@ class _GroupChatDetailsScreenState extends State<GroupChatDetailsScreen> {
           children: [
             Container(
               width: double.maxFinite,
-              color: Colors.grey.shade50,
+              decoration: BoxDecoration(
+                gradient: LinearGradient(
+                  begin: Alignment.topCenter,
+                  end: Alignment.bottomCenter,
+                  colors: [
+                    StreamChatTheme.of(context).colorTheme.whiteSmoke,
+                    StreamChatTheme.of(context).colorTheme.whiteSnow,
+                  ],
+                ),
+              ),
               child: Padding(
                 padding: const EdgeInsets.symmetric(
                   vertical: 8,

example/lib/main.dart

@@ -151,113 +151,116 @@ class _HomePageState extends State<HomePage> {
 
   Drawer _buildDrawer(BuildContext context, User user) {
     return Drawer(
-      child: SafeArea(
+      child: Container(
-        child: Padding(
+        color: StreamChatTheme.of(context).colorTheme.white,
-          padding: EdgeInsets.only(
+        child: SafeArea(
-            top: MediaQuery.of(context).viewPadding.top + 8,
+          child: Padding(
-          ),
+            padding: EdgeInsets.only(
-          child: Column(
+              top: MediaQuery.of(context).viewPadding.top + 8,
-            children: [
+            ),
-              Padding(
+            child: Column(
-                padding: const EdgeInsets.only(
+              children: [
-                  bottom: 20.0,
+                Padding(
-                  left: 8,
+                  padding: const EdgeInsets.only(
+                    bottom: 20.0,
+                    left: 8,
+                  ),
+                  child: Row(
+                    children: [
+                      UserAvatar(
+                        user: user,
+                        showOnlineStatus: false,
+                        constraints: BoxConstraints.tight(Size.fromRadius(20)),
+                      ),
+                      Padding(
+                        padding: const EdgeInsets.only(left: 16.0),
+                        child: Text(
+                          user.name,
+                          style: TextStyle(
+                            fontSize: 16,
+                            fontWeight: FontWeight.bold,
+                          ),
+                        ),
+                      ),
+                    ],
+                  ),
                 ),
-                child: Row(
+                ListTile(
-                  children: [
+                  leading: StreamSvgIcon.penWrite(
-                    UserAvatar(
+                    color: StreamChatTheme.of(context)
-                      user: user,
+                        .colorTheme
-                      showOnlineStatus: false,
+                        .black
-                      constraints: BoxConstraints.tight(Size.fromRadius(20)),
+                        .withOpacity(.5),
+                  ),
+                  onTap: () {
+                    Navigator.popAndPushNamed(
+                      context,
+                      Routes.NEW_CHAT,
+                    );
+                  },
+                  title: Text(
+                    'New direct message',
+                    style: TextStyle(
+                      fontSize: 14.5,
                     ),
-                    Padding(
+                  ),
-                      padding: const EdgeInsets.only(left: 16.0),
+                ),
-                      child: Text(
+                ListTile(
-                        user.name,
+                  leading: StreamSvgIcon.contacts(
+                    color: StreamChatTheme.of(context)
+                        .colorTheme
+                        .black
+                        .withOpacity(.5),
+                  ),
+                  onTap: () {
+                    Navigator.popAndPushNamed(
+                      context,
+                      Routes.NEW_GROUP_CHAT,
+                    );
+                  },
+                  title: Text(
+                    'New group',
+                    style: TextStyle(
+                      fontSize: 14.5,
+                    ),
+                  ),
+                ),
+                Expanded(
+                  child: Container(
+                    alignment: Alignment.bottomCenter,
+                    child: ListTile(
+                      onTap: () async {
+                        Navigator.pop(context);
+
+                        final secureStorage = FlutterSecureStorage();
+                        await secureStorage.deleteAll();
+
+                        StreamChat.of(context).client.disconnect(
+                              clearUser: true,
+                            );
+
+                        await Navigator.pushReplacementNamed(
+                          context,
+                          Routes.CHOOSE_USER,
+                        );
+                      },
+                      leading: StreamSvgIcon.user(
+                        color: StreamChatTheme.of(context)
+                            .colorTheme
+                            .black
+                            .withOpacity(.5),
+                      ),
+                      title: Text(
+                        'Sign out',
                         style: TextStyle(
-                          fontSize: 16,
+                          fontSize: 14.5,
-                          fontWeight: FontWeight.bold,
                         ),
                       ),
                     ),
-                  ],
-                ),
-              ),
-              ListTile(
-                leading: StreamSvgIcon.penWrite(
-                  color: StreamChatTheme.of(context)
-                      .colorTheme
-                      .black
-                      .withOpacity(.5),
-                ),
-                onTap: () {
-                  Navigator.popAndPushNamed(
-                    context,
-                    Routes.NEW_CHAT,
-                  );
-                },
-                title: Text(
-                  'New direct message',
-                  style: TextStyle(
-                    fontSize: 14.5,
                   ),
                 ),
-              ),
+              ],
-              ListTile(
+            ),
-                leading: StreamSvgIcon.contacts(
-                  color: StreamChatTheme.of(context)
-                      .colorTheme
-                      .black
-                      .withOpacity(.5),
-                ),
-                onTap: () {
-                  Navigator.popAndPushNamed(
-                    context,
-                    Routes.NEW_GROUP_CHAT,
-                  );
-                },
-                title: Text(
-                  'New group',
-                  style: TextStyle(
-                    fontSize: 14.5,
-                  ),
-                ),
-              ),
-              Expanded(
-                child: Container(
-                  alignment: Alignment.bottomCenter,
-                  child: ListTile(
-                    onTap: () async {
-                      Navigator.pop(context);
-
-                      final secureStorage = FlutterSecureStorage();
-                      await secureStorage.deleteAll();
-
-                      StreamChat.of(context).client.disconnect(
-                            clearUser: true,
-                          );
-
-                      await Navigator.pushReplacementNamed(
-                        context,
-                        Routes.CHOOSE_USER,
-                      );
-                    },
-                    leading: StreamSvgIcon.user(
-                      color: StreamChatTheme.of(context)
-                          .colorTheme
-                          .black
-                          .withOpacity(.5),
-                    ),
-                    title: Text(
-                      'Sign out',
-                      style: TextStyle(
-                        fontSize: 14.5,
-                      ),
-                    ),
-                  ),
-                ),
-              ),
-            ],
           ),
         ),
       ),
@@ -488,7 +491,7 @@ class ThreadPage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: Color.fromRGBO(252, 252, 252, 1),
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       appBar: ThreadHeader(
         parent: parent,
       ),

example/lib/new_chat_screen.dart

@@ -119,7 +119,7 @@ class _NewChatScreenState extends State<NewChatScreen> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: Color.fromRGBO(252, 252, 252, 1),
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       appBar: AppBar(
         elevation: 0,
         backgroundColor: StreamChatTheme.of(context).colorTheme.white,
@@ -215,7 +215,9 @@ class _NewChatScreenState extends State<NewChatScreen> {
                         StreamNeumorphicButton(
                           child: Center(
                             child: StreamSvgIcon.contacts(
-                              color: Color(0xFF006CFF),
+                              color: StreamChatTheme.of(context)
+                                  .colorTheme
+                                  .accentBlue,
                               size: 24,
                             ),
                           ),

example/lib/new_group_chat_screen.dart

@@ -3,9 +3,8 @@ import 'dart:async';
 import 'package:flutter/material.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
-import 'group_chat_details_screen.dart';
-import 'search_text_field.dart';
 import 'routes/routes.dart';
+import 'search_text_field.dart';
 
 class NewGroupChatScreen extends StatefulWidget {
   @override
@@ -53,7 +52,7 @@ class _NewGroupChatScreenState extends State<NewGroupChatScreen> {
   Widget build(BuildContext context) {
     return SafeArea(
       child: Scaffold(
-        backgroundColor: Color.fromRGBO(252, 252, 252, 1),
+        backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
         body: NestedScrollView(
           floatHeaderSlivers: true,
           headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
@@ -142,18 +141,17 @@ class _NewGroupChatScreenState extends State<NewGroupChatScreen> {
                                             .white,
                                         shape: BoxShape.circle,
                                         border: Border.all(
-                                          color: Colors.grey.shade100,
-                                        ),
-                                      ),
-                                      child: Padding(
-                                        padding: const EdgeInsets.all(0.0),
-                                        child: StreamSvgIcon.close(
                                           color: StreamChatTheme.of(context)
                                               .colorTheme
-                                              .black,
+                                              .whiteSnow,
-                                          size: 24,
                                         ),
                                       ),
+                                      child: StreamSvgIcon.close(
+                                        color: StreamChatTheme.of(context)
+                                            .colorTheme
+                                            .black,
+                                        size: 24,
+                                      ),
                                     ),
                                   ),
                                 )

example/lib/search_text_field.dart

@@ -24,7 +24,7 @@ class SearchTextField extends StatelessWidget {
       decoration: BoxDecoration(
         color: StreamChatTheme.of(context).colorTheme.white,
         border: Border.all(
-          color: StreamChatTheme.of(context).colorTheme.white,
+          color: StreamChatTheme.of(context).colorTheme.greyWhisper,
         ),
         borderRadius: BorderRadius.circular(24),
       ),

example/pubspec.yaml

@@ -1,6 +1,6 @@
 name: example
 description: A new Flutter project.
-version: 1.0.98+101
+version: 1.0.99+102
 
 environment:
   sdk: ">=2.2.2 <3.0.0"

lib/src/channel_list_view.dart

@@ -336,8 +336,8 @@ class _ChannelListViewState extends State<ChannelListView>
   Shimmer _buildLoadingItem() {
     if (widget.crossAxisCount > 1) {
       return Shimmer.fromColors(
-        baseColor: Color(0xffE5E5E5),
+        baseColor: StreamChatTheme.of(context).colorTheme.greyGainsboro,
-        highlightColor: Color(0xffffffff),
+        highlightColor: StreamChatTheme.of(context).colorTheme.whiteSmoke,
         child: Column(
           children: [
             SizedBox(
@@ -367,8 +367,8 @@ class _ChannelListViewState extends State<ChannelListView>
       );
     } else {
       return Shimmer.fromColors(
-        baseColor: Color(0xffE5E5E5),
+        baseColor: StreamChatTheme.of(context).colorTheme.greyGainsboro,
-        highlightColor: StreamChatTheme.of(context).colorTheme.white,
+        highlightColor: StreamChatTheme.of(context).colorTheme.whiteSmoke,
         child: ListTile(
           leading: Container(
             decoration: BoxDecoration(

lib/src/channel_unread_indicator.dart

@@ -36,7 +36,7 @@ class ChannelUnreadIndicator extends StatelessWidget {
                 '${snapshot.data}',
                 style: TextStyle(
                   fontSize: 11,
-                  color: StreamChatTheme.of(context).colorTheme.white,
+                  color: Colors.white,
                 ),
               ),
             ),

lib/src/full_screen_media.dart

@@ -100,9 +100,7 @@ class _FullScreenMediaState extends State<FullScreenMedia>
                                       .channelTheme
                                       .channelHeaderTheme
                                       .color,
-                                  end: StreamChatTheme.of(context)
+                                  end: Colors.black)
-                                      .colorTheme
-                                      .black)
                               .lerp(_controller.value),
                         ),
                         onTapUp: (a, b, c) {

lib/src/image_actions_modal.dart

@@ -35,7 +35,7 @@ class ImageActionsModal extends StatelessWidget {
               begin: Alignment.topCenter,
               end: Alignment.bottomCenter,
               colors: [
-                StreamChatTheme.of(context).colorTheme.black.withOpacity(0.8),
+                Colors.black.withOpacity(0.8),
                 Colors.transparent,
               ],
               stops: [0.0, 0.4],
@@ -110,10 +110,10 @@ class ImageActionsModal extends StatelessWidget {
                   shape: RoundedRectangleBorder(
                     borderRadius: BorderRadius.circular(16),
                   ),
-                  color: Color(0xffe5e5e5),
                   child: Column(
                     crossAxisAlignment: CrossAxisAlignment.stretch,
                     children: ListTile.divideTiles(
+                      color: StreamChatTheme.of(context).colorTheme.greyWhisper,
                       context: context,
                       tiles: [
                         _buildButton(
@@ -203,6 +203,7 @@ class ImageActionsModal extends StatelessWidget {
     );
 
     return Material(
+      color: StreamChatTheme.of(context).colorTheme.white,
       child: InkWell(
         onTap: onTap,
         child: ListTile(

lib/src/image_footer.dart

@@ -5,10 +5,10 @@ import 'dart:typed_data';
 
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:chewie/chewie.dart';
+import 'package:dio/dio.dart';
 import 'package:esys_flutter_share/esys_flutter_share.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
-import 'package:dio/dio.dart';
 import 'package:image_gallery_saver/image_gallery_saver.dart';
 import 'package:path_provider/path_provider.dart';
 import 'package:stream_chat/stream_chat.dart';
@@ -300,7 +300,7 @@ class _ImageFooterState extends State<ImageFooter> {
                               limit: 25,
                             ),
                             filter: {
-                              if (_searchController.text.isNotEmpty)
+                              if (_channelNameQuery?.trim()?.isNotEmpty == true)
                                 'name': {
                                   r'$autocomplete': _channelNameQuery,
                                 },
@@ -311,7 +311,7 @@ class _ImageFooterState extends State<ImageFooter> {
                             sort: [
                               SortOption(
                                 'name',
-                                direction: 1,
+                                direction: SortOption.ASC,
                               ),
                             ],
                             emptyBuilder: (_) {
@@ -356,6 +356,8 @@ class _ImageFooterState extends State<ImageFooter> {
                             color: StreamChatTheme.of(context).colorTheme.white,
                             height: 48.0,
                             child: Material(
+                              color:
+                                  StreamChatTheme.of(context).colorTheme.white,
                               child: InkWell(
                                 onTap: () async {
                                   var url = widget

lib/src/message_input.dart

@@ -1343,7 +1343,7 @@ class MessageInputState extends State<MessageInput> {
                                           StreamChatTheme.of(context)
                                               .colorTheme
                                               .black
-                                              .withOpacity(0.2),
+                                              .withOpacity(0.6),
                                       maxRadius: 12.0,
                                       child: StreamSvgIcon.close(
                                         color: StreamChatTheme.of(context)

lib/src/message_list_view.dart

@@ -345,10 +345,12 @@ class _MessageListViewState extends State<MessageListView> {
                                     begin: Alignment.topCenter,
                                     end: Alignment.bottomCenter,
                                     colors: [
-                                      Color(0XFFF7F7F7),
                                       StreamChatTheme.of(context)
                                           .colorTheme
                                           .whiteSmoke,
+                                      StreamChatTheme.of(context)
+                                          .colorTheme
+                                          .whiteSnow,
                                     ],
                                   ),
                                 ),
@@ -844,7 +846,7 @@ class _MessageListViewState extends State<MessageListView> {
       }
       if (event.message.user.id == streamChannel.channel.client.state.user.id) {
         WidgetsBinding.instance.addPostFrameCallback((_) {
-          _scrollController.jumpTo(
+          _scrollController?.jumpTo(
             index: 0,
           );
         });

lib/src/stream_chat_theme.dart

@@ -381,33 +381,41 @@ class TextTheme {
     this.title = const TextStyle(
       fontSize: 22,
       fontWeight: FontWeight.bold,
+      color: Colors.black,
     ),
     this.headlineBold = const TextStyle(
       fontSize: 16,
       fontWeight: FontWeight.bold,
+      color: Colors.black,
     ),
     this.headline = const TextStyle(
       fontSize: 16,
       fontWeight: FontWeight.w500,
+      color: Colors.black,
     ),
     this.bodyBold = const TextStyle(
       fontSize: 14,
       fontWeight: FontWeight.bold,
+      color: Colors.black,
     ),
     this.body = const TextStyle(
       fontSize: 14,
       fontWeight: FontWeight.w500,
+      color: Colors.black,
     ),
     this.footnoteBold = const TextStyle(
       fontSize: 12,
       fontWeight: FontWeight.w500,
+      color: Colors.black,
     ),
     this.footnote = const TextStyle(
       fontSize: 12,
+      color: Colors.black,
     ),
     this.captionBold = const TextStyle(
       fontSize: 10,
       fontWeight: FontWeight.bold,
+      color: Colors.black,
     ),
   });
 

lib/src/unread_indicator.dart

@@ -34,7 +34,7 @@ class UnreadIndicator extends StatelessWidget {
                 '${snapshot.data}',
                 style: TextStyle(
                   fontSize: 11,
-                  color: StreamChatTheme.of(context).colorTheme.white,
+                  color: Colors.white,
                 ),
               ),
             ),

lib/src/user_item.dart

@@ -74,6 +74,8 @@ class UserItem extends StatelessWidget {
       ),
       trailing: selected
           ? CircleAvatar(
+              backgroundColor:
+                  StreamChatTheme.of(context).colorTheme.accentBlue,
               child: StreamSvgIcon.check(
                 size: 20,
                 color: StreamChatTheme.of(context).colorTheme.white,