From f8bffceb4b851e618a71b91d254c7da3d6b8f9c1 Mon Sep 17 00:00:00 2001 From: HammadAsiif Date: Tue, 6 Aug 2024 09:57:16 +0200 Subject: [PATCH] chore(flutter_chat): various fixes and improvements MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - style: use consistent font in buttons - fix: update profile picture icon for adding a group chat to match design - fix: align "Write your message here" placeholder text and buttons properly in the input box - fix: ensure 'next' button is not visible when no one is selected for group chat - fix: allow scroll to go further so the last person in the list is not hidden by the ‘next’ button - fix: make entire name clickable when adding members to a group chat - fix: change text from “create a groupchat” to “start a groupchat” - fix: make 'create group chat' button inactive until a name is entered - style: adjust image picker icon sizes, and cancel button font --- .../lib/src/models/message_model.dart | 1 + .../lib/src/config/chat_translations.dart | 2 +- .../lib/src/screens/chat_detail_screen.dart | 3 + .../src/screens/creation/new_chat_screen.dart | 5 +- .../creation/new_group_chat_overview.dart | 61 ++++++++++++------- .../creation/new_group_chat_screen.dart | 29 ++++----- .../screens/creation/widgets/user_list.dart | 2 +- 7 files changed, 62 insertions(+), 41 deletions(-) diff --git a/packages/chat_repository_interface/lib/src/models/message_model.dart b/packages/chat_repository_interface/lib/src/models/message_model.dart index ce9a25d..9b315d4 100644 --- a/packages/chat_repository_interface/lib/src/models/message_model.dart +++ b/packages/chat_repository_interface/lib/src/models/message_model.dart @@ -15,6 +15,7 @@ class MessageModel { required this.timestamp, required this.senderId, }); + /// The chat id final String chatId; diff --git a/packages/flutter_chat/lib/src/config/chat_translations.dart b/packages/flutter_chat/lib/src/config/chat_translations.dart index 2113167..fb0685f 100644 --- a/packages/flutter_chat/lib/src/config/chat_translations.dart +++ b/packages/flutter_chat/lib/src/config/chat_translations.dart @@ -56,7 +56,7 @@ class ChatTranslations { this.chatsTitle = "Chats", this.chatsUnread = "unread", this.newChatButton = "Start chat", - this.newGroupChatButton = "Create a groupchat", + this.newGroupChatButton = "Start a groupchat", this.newChatTitle = "Start a chat", this.image = "Image", this.searchPlaceholder = "Search...", diff --git a/packages/flutter_chat/lib/src/screens/chat_detail_screen.dart b/packages/flutter_chat/lib/src/screens/chat_detail_screen.dart index d77734b..d27d3f9 100644 --- a/packages/flutter_chat/lib/src/screens/chat_detail_screen.dart +++ b/packages/flutter_chat/lib/src/screens/chat_detail_screen.dart @@ -396,6 +396,7 @@ class _ChatBottomState extends State<_ChatBottom> { context, _textEditingController, Row( + crossAxisAlignment: CrossAxisAlignment.center, mainAxisSize: MainAxisSize.min, children: [ IconButton( @@ -435,6 +436,8 @@ class _ChatBottomState extends State<_ChatBottom> { widget.options.translations, ) ?? TextField( + textAlign: TextAlign.start, + textAlignVertical: TextAlignVertical.center, style: theme.textTheme.bodySmall, textCapitalization: TextCapitalization.sentences, controller: _textEditingController, diff --git a/packages/flutter_chat/lib/src/screens/creation/new_chat_screen.dart b/packages/flutter_chat/lib/src/screens/creation/new_chat_screen.dart index dd72687..80fe780 100644 --- a/packages/flutter_chat/lib/src/screens/creation/new_chat_screen.dart +++ b/packages/flutter_chat/lib/src/screens/creation/new_chat_screen.dart @@ -198,12 +198,13 @@ class _Body extends StatelessWidget { onPressed: onPressCreateGroupChat, child: Row( mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.center, children: [ const Icon( - Icons.groups, + Icons.groups_2, ), const SizedBox( - width: 4, + width: 8, ), Text( translations.newGroupChatButton, diff --git a/packages/flutter_chat/lib/src/screens/creation/new_group_chat_overview.dart b/packages/flutter_chat/lib/src/screens/creation/new_group_chat_overview.dart index 4612053..d1013e7 100644 --- a/packages/flutter_chat/lib/src/screens/creation/new_group_chat_overview.dart +++ b/packages/flutter_chat/lib/src/screens/creation/new_group_chat_overview.dart @@ -110,6 +110,7 @@ class _Body extends StatefulWidget { class _BodyState extends State<_Body> { final TextEditingController _chatNameController = TextEditingController(); final TextEditingController _bioController = TextEditingController(); + final ValueNotifier isButtonEnabled = ValueNotifier(false); Uint8List? image; GlobalKey formKey = GlobalKey(); @@ -121,6 +122,17 @@ class _BodyState extends State<_Body> { void initState() { users = widget.users; super.initState(); + _chatNameController.addListener(() { + isButtonEnabled.value = _chatNameController.text.isNotEmpty; + }); + } + + @override + void dispose() { + _chatNameController.dispose(); + _bioController.dispose(); + isButtonEnabled.dispose(); + super.dispose(); } @override @@ -325,31 +337,34 @@ class _BodyState extends State<_Body> { vertical: 24, horizontal: 80, ), - child: FilledButton( - onPressed: users.isNotEmpty - ? () async { - if (!isPressed) { - isPressed = true; - if (formKey.currentState!.validate()) { - await widget.onComplete( - users, - _chatNameController.text, - _bioController.text, - image, - ); + child: ValueListenableBuilder( + valueListenable: isButtonEnabled, + builder: (context, isEnabled, child) => FilledButton( + onPressed: users.isNotEmpty + ? () async { + if (!isPressed) { + isPressed = true; + if (formKey.currentState!.validate()) { + await widget.onComplete( + users, + _chatNameController.text, + _bioController.text, + image, + ); + } + isPressed = false; } - isPressed = false; } - } - : null, - child: Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Text( - translations.createGroupChatButton, - style: theme.textTheme.displayLarge, - ), - ], + : null, + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + translations.createGroupChatButton, + style: theme.textTheme.displayLarge, + ), + ], + ), ), ), ), diff --git a/packages/flutter_chat/lib/src/screens/creation/new_group_chat_screen.dart b/packages/flutter_chat/lib/src/screens/creation/new_group_chat_screen.dart index f2c6bcf..d96f25f 100644 --- a/packages/flutter_chat/lib/src/screens/creation/new_group_chat_screen.dart +++ b/packages/flutter_chat/lib/src/screens/creation/new_group_chat_screen.dart @@ -274,20 +274,21 @@ class _NextButton extends StatelessWidget { vertical: 24, horizontal: 80, ), - child: FilledButton( - onPressed: selectedUsers.isNotEmpty - ? () { - onPressGroupChatOverview(selectedUsers); - } - : null, - child: Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Text( - chatOptions.translations.next, - style: theme.textTheme.displayLarge, - ), - ], + child: Visibility( + visible: selectedUsers.isNotEmpty, + child: FilledButton( + onPressed: () async { + await onPressGroupChatOverview(selectedUsers); + }, + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + chatOptions.translations.next, + style: theme.textTheme.displayLarge, + ), + ], + ), ), ), ), diff --git a/packages/flutter_chat/lib/src/screens/creation/widgets/user_list.dart b/packages/flutter_chat/lib/src/screens/creation/widgets/user_list.dart index 6afc14f..a54b36d 100644 --- a/packages/flutter_chat/lib/src/screens/creation/widgets/user_list.dart +++ b/packages/flutter_chat/lib/src/screens/creation/widgets/user_list.dart @@ -72,7 +72,7 @@ class _UserListState extends State { ) .toList(); return Padding( - padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 12), + padding: const EdgeInsets.only(top: 8, left: 12, right: 12, bottom: 80), child: ListView.builder( itemCount: filteredUsers.length, itemBuilder: (context, index) {