From 1fd51a31bd935ccfb723bd86c46c10f11a067250 Mon Sep 17 00:00:00 2001 From: Jaimin Rana Date: Tue, 26 Sep 2023 00:02:02 +0530 Subject: [PATCH] =?UTF-8?q?feat:=E2=9C=A8Added=20a=20feature=20to=20show?= =?UTF-8?q?=20message=20time=20in=20message=20bubble.=20Removed=20enableSw?= =?UTF-8?q?ipeToSeeTime(bool)=20&=20added=20showMessageTimeIn(Enum)=20from?= =?UTF-8?q?=20FeatureActiveConfig=20class.(#115)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 6 +++ .../android/app/src/main/AndroidManifest.xml | 1 - example/lib/data.dart | 26 +----------- example/lib/main.dart | 7 +--- lib/src/models/feature_active_config.dart | 10 ++--- lib/src/models/message_configuration.dart | 7 +++- lib/src/utils/package_strings.dart | 3 ++ lib/src/values/enumaration.dart | 13 ++++-- lib/src/values/typedefs.dart | 1 + lib/src/widgets/chat_bubble_widget.dart | 8 ++-- lib/src/widgets/chat_groupedlist_widget.dart | 4 -- lib/src/widgets/chat_list_widget.dart | 6 +-- lib/src/widgets/chat_view.dart | 2 - lib/src/widgets/chatui_textfield.dart | 4 +- lib/src/widgets/image_message_view.dart | 32 ++++++++------- lib/src/widgets/message_time_widget.dart | 27 +++++++----- lib/src/widgets/message_view.dart | 41 ++++++++++--------- lib/src/widgets/text_message_view.dart | 38 ++++++++--------- lib/src/widgets/voice_message_view.dart | 36 ++++++++-------- pubspec.yaml | 2 +- 20 files changed, 133 insertions(+), 141 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index ec2141f0..f7e6b208 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +## [1.4.0] (UnReleased) + +* **Feat**: [115](https://github.com/SimformSolutionsPvtLtd/flutter_chatview/issues/115) Added + option for showing message sent/received time in message bubble. Removed 'enableSwipeToSeeTime' + & added 'showMessageTimeIn' from FeatureActiveConfig class for the visibility of message time. + ## [1.3.1] * **Feat**: [105](https://github.com/SimformSolutionsPvtLtd/flutter_chatview/pull/105) Allow user diff --git a/example/android/app/src/main/AndroidManifest.xml b/example/android/app/src/main/AndroidManifest.xml index 8f4de1ec..28d18c24 100644 --- a/example/android/app/src/main/AndroidManifest.xml +++ b/example/android/app/src/main/AndroidManifest.xml @@ -7,7 +7,6 @@ - diff --git a/example/lib/data.dart b/example/lib/data.dart index 5129bdb9..cf086eae 100644 --- a/example/lib/data.dart +++ b/example/lib/data.dart @@ -8,8 +8,7 @@ class Data { id: '1', message: "Hi!", createdAt: DateTime.now(), - sendBy: '1', - // userId of who sends the message + sendBy: '1', // userId of who sends the message status: MessageStatus.read, ), Message( @@ -107,14 +106,6 @@ class Data { reaction: Reaction(reactions: ['\u{2764}'], reactedUserIds: ['2']), status: MessageStatus.read, ), - Message( - id: '12', - message: "https://miro.medium.com/max/1000/0*s7of7kWnf9fDg4XM.jpeg", - createdAt: DateTime.now(), - messageType: MessageType.image, - sendBy: '2', - status: MessageStatus.read, - ), Message( id: '12', message: "🤩🤩", @@ -122,20 +113,5 @@ class Data { sendBy: '2', status: MessageStatus.read, ), - Message( - id: '16', - message: "🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩", - createdAt: DateTime.now(), - sendBy: '2', - status: MessageStatus.read, - ), - Message( - id: '116', - message: "", - createdAt: DateTime.now(), - sendBy: '2', - status: MessageStatus.read, - messageType: MessageType.voice, - ), ]; } diff --git a/example/lib/main.dart b/example/lib/main.dart index 5e35e9e6..bdc02f92 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -78,12 +78,9 @@ class _ChatScreenState extends State { currentUser: currentUser, chatController: _chatController, onSendTap: _onSendTap, - featureActiveConfig: FeatureActiveConfig( - lastSeenAgoBuilderVisibility: false, + featureActiveConfig: const FeatureActiveConfig( + lastSeenAgoBuilderVisibility: true, receiptsBuilderVisibility: true, - enablePagination: true, - showMessageTimeIn: ShowMessageTimeIn.outsideChatBubble, - enableSwipeToSeeTime: true, ), chatViewState: ChatViewState.hasMessages, chatViewStateConfig: ChatViewStateConfiguration( diff --git a/lib/src/models/feature_active_config.dart b/lib/src/models/feature_active_config.dart index 0ebe295c..015d7103 100644 --- a/lib/src/models/feature_active_config.dart +++ b/lib/src/models/feature_active_config.dart @@ -5,7 +5,6 @@ class FeatureActiveConfig { this.enableSwipeToReply = true, this.enableReactionPopup = true, this.enableTextField = true, - this.enableSwipeToSeeTime = true, this.enableCurrentUserProfileAvatar = false, this.enableOtherUserProfileAvatar = true, this.enableReplySnackBar = true, @@ -14,7 +13,7 @@ class FeatureActiveConfig { this.enableDoubleTapToLike = true, this.lastSeenAgoBuilderVisibility = true, this.receiptsBuilderVisibility = true, - this.showMessageTimeIn = ShowMessageTimeIn.none, + this.showMessageTimeIn = ShowMessageCreateTime.onRightSwipe, }) ; /// Used for enable/disable swipe to reply. final bool enableSwipeToReply; @@ -25,9 +24,6 @@ class FeatureActiveConfig { /// Used for enable/disable text field. final bool enableTextField; - /// Used for enable/disable swipe whole chat to see message created time. - final bool enableSwipeToSeeTime; - /// Used for enable/disable current user profile circle. final bool enableCurrentUserProfileAvatar; @@ -52,5 +48,7 @@ class FeatureActiveConfig { /// Controls the visibility of the message [receiptsBuilder] final bool receiptsBuilderVisibility; - final ShowMessageTimeIn showMessageTimeIn; + /// Controls the visibility of message created time. + /// default value: onRightSwipe + final ShowMessageCreateTime showMessageTimeIn; } diff --git a/lib/src/models/message_configuration.dart b/lib/src/models/message_configuration.dart index 2844c60e..2aee48ae 100644 --- a/lib/src/models/message_configuration.dart +++ b/lib/src/models/message_configuration.dart @@ -19,10 +19,11 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ -import 'package:chatview/src/models/models.dart'; +import 'package:chatview/chatview.dart'; import 'package:chatview/src/models/voice_message_configuration.dart'; import 'package:flutter/material.dart'; + class MessageConfiguration { /// Provides configuration of image message appearance. final ImageMessageConfiguration? imageMessageConfig; @@ -39,11 +40,15 @@ class MessageConfiguration { /// Configurations for voice message bubble final VoiceMessageConfiguration? voiceMessageConfig; + /// Allow user to set custom formatting of message time. + final MessageDateTimeBuilder? messageDateTimeBuilder; + const MessageConfiguration({ this.imageMessageConfig, this.messageReactionConfig, this.emojiMessageConfig, this.customMessageBuilder, this.voiceMessageConfig, + this.messageDateTimeBuilder, }); } diff --git a/lib/src/utils/package_strings.dart b/lib/src/utils/package_strings.dart index 85c0e305..03386c20 100644 --- a/lib/src/utils/package_strings.dart +++ b/lib/src/utils/package_strings.dart @@ -34,4 +34,7 @@ class PackageStrings { static const String photo = "Photo"; static const String send = "Send"; static const String you = "You"; + static const String emptyString = ''; + static const String messageTimeSpacing =' '; + } diff --git a/lib/src/values/enumaration.dart b/lib/src/values/enumaration.dart index cbbc22ea..bceb7336 100644 --- a/lib/src/values/enumaration.dart +++ b/lib/src/values/enumaration.dart @@ -53,14 +53,21 @@ extension ChatViewStateExtension on ChatViewState { bool get noMessages => this == ChatViewState.noData; } -enum ShowMessageTimeIn { +enum ShowMessageCreateTime { + /// Used for viewing the message created time inside the chatBubble. insideChatBubble, + /// Used for viewing the message created time outside the chatBubble. outsideChatBubble, - none; + /// Used for enable/disable swipe whole chat to see message created time. + onRightSwipe, + /// Used for disabling the viewing of the message created time. + disable; bool get isInsideChatBubble => this == insideChatBubble; bool get isOutSideChatBubble => this == outsideChatBubble; - bool get isNone => this == none; + bool get isOnRightSwipe => this == onRightSwipe; + + bool get isDisable => this == disable; } diff --git a/lib/src/values/typedefs.dart b/lib/src/values/typedefs.dart index 43ea2e41..dd7beb0e 100644 --- a/lib/src/values/typedefs.dart +++ b/lib/src/values/typedefs.dart @@ -35,3 +35,4 @@ typedef VoidCallBackWithFuture = Future Function(); typedef StringsCallBack = void Function(String emoji, String messageId); typedef StringWithReturnWidget = Widget Function(String separator); typedef DragUpdateDetailsCallback = void Function(DragUpdateDetails); +typedef MessageDateTimeBuilder = Widget Function(DateTime date); diff --git a/lib/src/widgets/chat_bubble_widget.dart b/lib/src/widgets/chat_bubble_widget.dart index 58c32e60..7af71c22 100644 --- a/lib/src/widgets/chat_bubble_widget.dart +++ b/lib/src/widgets/chat_bubble_widget.dart @@ -47,7 +47,6 @@ class ChatBubbleWidget extends StatefulWidget { this.messageConfig, this.onReplyTap, this.shouldHighlight = false, - this.showMessageTimeIn = ShowMessageTimeIn.none, }) : super(key: key); /// Represent current instance of message. @@ -93,8 +92,6 @@ class ChatBubbleWidget extends StatefulWidget { /// Flag for when user tap on replied message and highlight actual message. final bool shouldHighlight; - final ShowMessageTimeIn showMessageTimeIn; - @override State createState() => _ChatBubbleWidgetState(); } @@ -130,13 +127,15 @@ class _ChatBubbleWidgetState extends State { final messagedUser = chatController?.getUserFromId(widget.message.sendBy); return Stack( children: [ - if (featureActiveConfig?.enableSwipeToSeeTime ?? true) ...[ + if (featureActiveConfig?.showMessageTimeIn.isOnRightSwipe ?? true) ...[ Visibility( visible: widget.slideAnimation?.value.dx == 0.0 ? false : true, child: Positioned.fill( child: Align( alignment: Alignment.centerRight, child: MessageTimeWidget( + messageDateTimeBuilder: + widget.messageConfig?.messageDateTimeBuilder, messageTime: widget.message.createdAt, isCurrentUser: isMessageBySender, messageTimeIconColor: widget.messageTimeIconColor, @@ -355,7 +354,6 @@ class _ChatBubbleWidgetState extends State { ?.repliedMsgAutoScrollConfig.highlightScale ?? 1.1, onMaxDuration: _onMaxDuration, - showMessageTimeIn: widget.showMessageTimeIn, ), ], ); diff --git a/lib/src/widgets/chat_groupedlist_widget.dart b/lib/src/widgets/chat_groupedlist_widget.dart index beb2d422..9f8b4da1 100644 --- a/lib/src/widgets/chat_groupedlist_widget.dart +++ b/lib/src/widgets/chat_groupedlist_widget.dart @@ -47,7 +47,6 @@ class ChatGroupedListWidget extends StatefulWidget { this.swipeToReplyConfig, this.repliedMessageConfig, this.typeIndicatorConfig, - this.showMessageTimeIn = ShowMessageTimeIn.none, }) : super(key: key); /// Allow user to swipe to see time while reaction pop is not open. @@ -93,8 +92,6 @@ class ChatGroupedListWidget extends StatefulWidget { /// swipe whole chat. final bool isEnableSwipeToSeeTime; - final ShowMessageTimeIn showMessageTimeIn; - @override State createState() => _ChatGroupedListWidgetState(); } @@ -332,7 +329,6 @@ class _ChatGroupedListWidgetState extends State false ? (replyId) => _onReplyTap(replyId, snapshot.data) : null, - showMessageTimeIn: widget.showMessageTimeIn, ); }, ); diff --git a/lib/src/widgets/chat_list_widget.dart b/lib/src/widgets/chat_list_widget.dart index bc3993f7..3f2ec1d3 100644 --- a/lib/src/widgets/chat_list_widget.dart +++ b/lib/src/widgets/chat_list_widget.dart @@ -51,7 +51,6 @@ class ChatListWidget extends StatefulWidget { this.loadMoreData, this.isLastPage, this.onChatListTap, - this.showMessageTimeIn = ShowMessageTimeIn.none, }) : super(key: key); /// Provides controller for accessing few function for running chat. @@ -109,8 +108,6 @@ class ChatListWidget extends StatefulWidget { /// Provides callback when user tap anywhere on whole chat. final VoidCallBack? onChatListTap; - final ShowMessageTimeIn showMessageTimeIn; - @override State createState() => _ChatListWidgetState(); } @@ -195,7 +192,7 @@ class _ChatListWidgetState extends State showTypingIndicator: showTypingIndicator, scrollController: scrollController, isEnableSwipeToSeeTime: - featureActiveConfig?.enableSwipeToSeeTime ?? true, + featureActiveConfig?.showMessageTimeIn.isOnRightSwipe ?? true, chatBackgroundConfig: widget.chatBackgroundConfig, assignReplyMessage: widget.assignReplyMessage, replyMessage: widget.replyMessage, @@ -224,7 +221,6 @@ class _ChatListWidgetState extends State } }, onChatListTap: _onChatListTap, - showMessageTimeIn: widget.showMessageTimeIn, ), if (featureActiveConfig?.enableReactionPopup ?? false) ReactionPopup( diff --git a/lib/src/widgets/chat_view.dart b/lib/src/widgets/chat_view.dart index 4c930e1b..1fa3771c 100644 --- a/lib/src/widgets/chat_view.dart +++ b/lib/src/widgets/chat_view.dart @@ -250,8 +250,6 @@ class _ChatViewState extends State assignReplyMessage: (message) => _sendMessageKey .currentState ?.assignReplyMessage(message), - showMessageTimeIn: - widget.featureActiveConfig.showMessageTimeIn, ); }, ), diff --git a/lib/src/widgets/chatui_textfield.dart b/lib/src/widgets/chatui_textfield.dart index e1097ae7..83638c66 100644 --- a/lib/src/widgets/chatui_textfield.dart +++ b/lib/src/widgets/chatui_textfield.dart @@ -106,9 +106,7 @@ class _ChatUITextFieldState extends State { if (defaultTargetPlatform == TargetPlatform.iOS || defaultTargetPlatform == TargetPlatform.android) { - controller = RecorderController( - - ); + controller = RecorderController(); } } diff --git a/lib/src/widgets/image_message_view.dart b/lib/src/widgets/image_message_view.dart index 24e6cbe3..d06aa5ba 100644 --- a/lib/src/widgets/image_message_view.dart +++ b/lib/src/widgets/image_message_view.dart @@ -24,9 +24,10 @@ import 'dart:io'; import 'package:chatview/chatview.dart'; import 'package:chatview/src/extensions/extensions.dart'; -import 'package:chatview/src/models/models.dart'; +import 'package:chatview/src/widgets/message_time_widget.dart'; import 'package:flutter/material.dart'; +import 'chat_view_inherited_widget.dart'; import 'reaction_widget.dart'; import 'share_icon.dart'; @@ -39,7 +40,7 @@ class ImageMessageView extends StatelessWidget { this.messageReactionConfig, this.highlightImage = false, this.highlightScale = 1.2, - this.showMessageTimeIn = ShowMessageTimeIn.none, + this.messageDateTimeBuilder, }) : super(key: key); /// Provides message instance of chat. @@ -60,7 +61,8 @@ class ImageMessageView extends StatelessWidget { /// Provides scale of highlighted image when user taps on replied image. final double highlightScale; - final ShowMessageTimeIn showMessageTimeIn; + /// Allow user to set custom formatting of message time. + final MessageDateTimeBuilder? messageDateTimeBuilder; String get imageUrl => message.message; @@ -71,6 +73,9 @@ class ImageMessageView extends StatelessWidget { @override Widget build(BuildContext context) { + final showMessageTimeIn = ChatViewInheritedWidget.of(context)! + .featureActiveConfig + .showMessageTimeIn; return Row( mainAxisSize: MainAxisSize.min, mainAxisAlignment: @@ -143,18 +148,17 @@ class ImageMessageView extends StatelessWidget { reaction: message.reaction, messageReactionConfig: messageReactionConfig, ), - if(!showMessageTimeIn.isNone) - Positioned( - right: message.reaction.reactions.isNotEmpty ? 16 : 18, - bottom: 20, - child: Text( - message.createdAt.getTimeFromDateTime, - style: TextStyle( - fontSize: 10, - color: Colors.white.withOpacity(0.5), - ), + if (!showMessageTimeIn.isOnRightSwipe && + !showMessageTimeIn.isDisable) + Positioned( + right: message.reaction.reactions.isNotEmpty ? 16 : 18, + bottom: 20, + child: messageDateTimeBuilder?.call(message.createdAt) ?? + MessageTimeWidget( + isCurrentUser: isMessageBySender, + messageTime: message.createdAt, + ), ), - ), ], ), if (!isMessageBySender) iconButton, diff --git a/lib/src/widgets/message_time_widget.dart b/lib/src/widgets/message_time_widget.dart index ff8730c4..910add57 100644 --- a/lib/src/widgets/message_time_widget.dart +++ b/lib/src/widgets/message_time_widget.dart @@ -19,10 +19,12 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ -import 'package:chatview/chatview.dart'; import 'package:chatview/src/extensions/extensions.dart'; +import 'package:chatview/src/values/typedefs.dart'; import 'package:flutter/material.dart'; +import 'chat_view_inherited_widget.dart'; + class MessageTimeWidget extends StatelessWidget { const MessageTimeWidget({ Key? key, @@ -30,7 +32,7 @@ class MessageTimeWidget extends StatelessWidget { required this.isCurrentUser, this.messageTimeTextStyle, this.messageTimeIconColor, - this.showMessageTimeIn = ShowMessageTimeIn.none, + this.messageDateTimeBuilder, }) : super(key: key); /// Provides message crated date time. @@ -46,17 +48,21 @@ class MessageTimeWidget extends StatelessWidget { /// seeing message sending time final Color? messageTimeIconColor; - final ShowMessageTimeIn showMessageTimeIn; + /// Allow user to set custom formatting of message time. + final MessageDateTimeBuilder? messageDateTimeBuilder; @override Widget build(BuildContext context) { - return !showMessageTimeIn.isNone + final showMessageTimeIn = ChatViewInheritedWidget.of(context)! + .featureActiveConfig + .showMessageTimeIn; + return !showMessageTimeIn.isOnRightSwipe ? Text( messageTime.getTimeFromDateTime, style: messageTimeTextStyle ?? TextStyle( fontSize: 10, - color: Colors.black.withOpacity(0.5), + color: Colors.black.withOpacity(0.6), ), ) : Align( @@ -81,11 +87,12 @@ class MessageTimeWidget extends StatelessWidget { ), ), const SizedBox(width: 4), - Text( - messageTime.getTimeFromDateTime, - style: - messageTimeTextStyle ?? const TextStyle(fontSize: 12), - ), + messageDateTimeBuilder?.call(messageTime) ?? + Text( + messageTime.getTimeFromDateTime, + style: messageTimeTextStyle ?? + const TextStyle(fontSize: 12), + ), ], ), ), diff --git a/lib/src/widgets/message_view.dart b/lib/src/widgets/message_view.dart index 97b27319..e621a40c 100644 --- a/lib/src/widgets/message_view.dart +++ b/lib/src/widgets/message_view.dart @@ -49,7 +49,6 @@ class MessageView extends StatefulWidget { this.messageConfig, this.onMaxDuration, this.controller, - this.showMessageTimeIn = ShowMessageTimeIn.none, }) : super(key: key); /// Provides message instance of chat. @@ -96,8 +95,6 @@ class MessageView extends StatefulWidget { final Function(int)? onMaxDuration; - final ShowMessageTimeIn showMessageTimeIn; - @override State createState() => _MessageViewState(); } @@ -159,6 +156,7 @@ class _MessageViewState extends State } Widget get _messageView { + final showMessageTimeIn = provide!.featureActiveConfig.showMessageTimeIn; final message = widget.message.message; final emojiMessageConfiguration = messageConfig?.emojiMessageConfig; @@ -182,7 +180,7 @@ class _MessageViewState extends State leftPadding2, widget.message.reaction.reactions.isNotEmpty ? 14 - : !widget.showMessageTimeIn.isNone + : !showMessageTimeIn.isOnRightSwipe ? 20 : 0, ), @@ -204,19 +202,21 @@ class _MessageViewState extends State messageConfig?.messageReactionConfig, isMessageBySender: widget.isMessageBySender, ), - if (!widget.showMessageTimeIn.isNone) - Positioned( - bottom: widget.message.reaction.reactions.isNotEmpty - ? -12 - : 5, - right: widget.isMessageBySender ? 10 : null, - left: widget.isMessageBySender ? null : 10, - child: MessageTimeWidget( - showMessageTimeIn: widget.showMessageTimeIn, - isCurrentUser: widget.isMessageBySender, - messageTime: widget.message.createdAt, + if (!showMessageTimeIn.isOnRightSwipe && + !showMessageTimeIn.isDisable) + Positioned( + bottom: widget.message.reaction.reactions.isNotEmpty + ? -12 + : 5, + right: widget.isMessageBySender ? 10 : null, + left: widget.isMessageBySender ? null : 10, + child: messageConfig?.messageDateTimeBuilder + ?.call(widget.message.createdAt) ?? + MessageTimeWidget( + isCurrentUser: widget.isMessageBySender, + messageTime: widget.message.createdAt, + ), ), - ), ], ); } else if (widget.message.messageType.isImage) { @@ -227,7 +227,8 @@ class _MessageViewState extends State messageReactionConfig: messageConfig?.messageReactionConfig, highlightImage: widget.shouldHighlight, highlightScale: widget.highlightScale, - showMessageTimeIn: widget.showMessageTimeIn, + messageDateTimeBuilder: + messageConfig?.messageDateTimeBuilder, ); } else if (widget.message.messageType.isText) { return TextMessageView( @@ -239,7 +240,8 @@ class _MessageViewState extends State messageReactionConfig: messageConfig?.messageReactionConfig, highlightColor: widget.highlightColor, highlightMessage: widget.shouldHighlight, - showMessageTimeIn: widget.showMessageTimeIn, + messageDateTimeBuilder: + messageConfig?.messageDateTimeBuilder, ); } else if (widget.message.messageType.isVoice) { return VoiceMessageView( @@ -251,7 +253,8 @@ class _MessageViewState extends State messageReactionConfig: messageConfig?.messageReactionConfig, inComingChatBubbleConfig: widget.inComingChatBubbleConfig, outgoingChatBubbleConfig: widget.outgoingChatBubbleConfig, - showMessageTimeIn: widget.showMessageTimeIn, + messageDateTimeBuilder: + messageConfig?.messageDateTimeBuilder, ); } else if (widget.message.messageType.isCustom && messageConfig?.customMessageBuilder != null) { diff --git a/lib/src/widgets/text_message_view.dart b/lib/src/widgets/text_message_view.dart index 35680373..634f1233 100644 --- a/lib/src/widgets/text_message_view.dart +++ b/lib/src/widgets/text_message_view.dart @@ -19,14 +19,15 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ +import 'package:chatview/chatview.dart'; +import 'package:chatview/src/utils/package_strings.dart'; import 'package:chatview/src/widgets/message_time_widget.dart'; import 'package:flutter/material.dart'; import 'package:chatview/src/extensions/extensions.dart'; -import 'package:chatview/src/models/models.dart'; -import '../../chatview.dart'; import '../utils/constants/constants.dart'; +import 'chat_view_inherited_widget.dart'; import 'link_preview.dart'; import 'reaction_widget.dart'; @@ -41,7 +42,7 @@ class TextMessageView extends StatelessWidget { this.messageReactionConfig, this.highlightMessage = false, this.highlightColor, - this.showMessageTimeIn = ShowMessageTimeIn.none, + this.messageDateTimeBuilder, }) : super(key: key); /// Represents current message is sent by current user. @@ -68,12 +69,16 @@ class TextMessageView extends StatelessWidget { /// Allow user to set color of highlighted message. final Color? highlightColor; - final ShowMessageTimeIn showMessageTimeIn; + /// Allow user to set custom formatting of message time. + final MessageDateTimeBuilder? messageDateTimeBuilder; @override Widget build(BuildContext context) { final textTheme = Theme.of(context).textTheme; final textMessage = message.message; + final showMessageTimeIn = ChatViewInheritedWidget.of(context)! + .featureActiveConfig + .showMessageTimeIn; return Padding( padding: showMessageTimeIn.isOutSideChatBubble ? const EdgeInsets.only(bottom: 10) @@ -107,32 +112,25 @@ class TextMessageView extends StatelessWidget { url: textMessage, ) : Text( - '$textMessage ${showMessageTimeIn.isInsideChatBubble ? ' ' : ''}', + '$textMessage ${showMessageTimeIn.isInsideChatBubble ? PackageStrings.messageTimeSpacing : PackageStrings.emptyString}', style: _textStyle ?? textTheme.bodyMedium!.copyWith( color: Colors.white, fontSize: 16, ), ), - if (showMessageTimeIn.isInsideChatBubble) Padding( padding: message.reaction.reactions.isNotEmpty ? const EdgeInsets.only(bottom: 4) : EdgeInsets.zero, - child: MessageTimeWidget( - showMessageTimeIn: showMessageTimeIn, + child: + messageDateTimeBuilder?.call(message.createdAt) ?? + MessageTimeWidget( messageTime: message.createdAt, isCurrentUser: isMessageBySender, ), ), - // Text( - // message.createdAt.getTimeFromDateTime, - // style: TextStyle( - // fontSize: 10, - // color: Colors.black.withOpacity(0.5), - // ), - // ), ], ), ), @@ -148,11 +146,11 @@ class TextMessageView extends StatelessWidget { bottom: -14, right: isMessageBySender ? 10 : null, left: isMessageBySender ? null : 12, - child: MessageTimeWidget( - showMessageTimeIn: showMessageTimeIn, - isCurrentUser: isMessageBySender, - messageTime: message.createdAt, - ), + child: messageDateTimeBuilder?.call(message.createdAt) ?? + MessageTimeWidget( + isCurrentUser: isMessageBySender, + messageTime: message.createdAt, + ), ), ], ), diff --git a/lib/src/widgets/voice_message_view.dart b/lib/src/widgets/voice_message_view.dart index aa46e4b0..79045904 100644 --- a/lib/src/widgets/voice_message_view.dart +++ b/lib/src/widgets/voice_message_view.dart @@ -20,7 +20,7 @@ class VoiceMessageView extends StatefulWidget { this.onMaxDuration, this.messageReactionConfig, this.config, - this.showMessageTimeIn = ShowMessageTimeIn.none, + this.messageDateTimeBuilder, }) : super(key: key); /// Provides configuration related to voice message. @@ -45,7 +45,8 @@ class VoiceMessageView extends StatefulWidget { /// Provides configuration of chat bubble appearance from current user of chat. final ChatBubble? outgoingChatBubbleConfig; - final ShowMessageTimeIn showMessageTimeIn; + /// Allow user to set custom formatting of message time. + final MessageDateTimeBuilder? messageDateTimeBuilder; @override State createState() => _VoiceMessageViewState(); @@ -86,8 +87,9 @@ class _VoiceMessageViewState extends State { @override Widget build(BuildContext context) { + final showMessageTimeIn = provide!.featureActiveConfig.showMessageTimeIn; return Padding( - padding: widget.showMessageTimeIn.isOutSideChatBubble + padding: showMessageTimeIn.isOutSideChatBubble ? const EdgeInsets.only(bottom: 10) : EdgeInsets.zero, child: Stack( @@ -157,21 +159,21 @@ class _VoiceMessageViewState extends State { reaction: widget.message.reaction, messageReactionConfig: widget.messageReactionConfig, ), - if(widget.showMessageTimeIn.isOutSideChatBubble) - Positioned( - //left: widget.isMessageBySender ? null : 14, - right: 18, - bottom: widget.showMessageTimeIn.isInsideChatBubble - ? widget.message.reaction.reactions.isNotEmpty - ? 18 - : 4 - : -16, - child: MessageTimeWidget( - showMessageTimeIn: widget.showMessageTimeIn, - isCurrentUser: widget.isMessageBySender, - messageTime: widget.message.createdAt, + if (showMessageTimeIn.isOutSideChatBubble) + Positioned( + right: 18, + bottom: showMessageTimeIn.isInsideChatBubble + ? widget.message.reaction.reactions.isNotEmpty + ? 18 + : 4 + : -16, + child: widget.messageDateTimeBuilder + ?.call(widget.message.createdAt) ?? + MessageTimeWidget( + isCurrentUser: widget.isMessageBySender, + messageTime: widget.message.createdAt, + ), ), - ), ], ), ); diff --git a/pubspec.yaml b/pubspec.yaml index bf4ee825..1dba6af0 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: chatview description: A Flutter package that allows you to integrate Chat View with highly customization options. -version: 1.3.1 +version: 1.4.0 issue_tracker: https://github.com/SimformSolutionsPvtLtd/flutter_chatview/issues repository: https://github.com/SimformSolutionsPvtLtd/flutter_chatview