From 720a9dad214d912819200fd6634e34016a3bd2f4 Mon Sep 17 00:00:00 2001 From: Dat PHAM HOANG Date: Wed, 16 Oct 2024 18:56:51 +0700 Subject: [PATCH] Update background color for file tile --- .../message/message_content_with_timestamp_builder.dart | 8 ++++++-- lib/pages/chat/events/message_download_content.dart | 3 +++ lib/pages/chat/events/message_download_content_web.dart | 3 +++ lib/pages/chat/events/message_upload_content.dart | 2 +- .../chat_details_files_item_style.dart | 4 +++- lib/widgets/file_widget/base_file_tile_widget.dart | 4 +++- lib/widgets/file_widget/download_file_tile_widget.dart | 4 +++- lib/widgets/file_widget/downloading_file_tile_widget.dart | 4 +++- lib/widgets/file_widget/file_tile_widget.dart | 1 + lib/widgets/file_widget/file_tile_widget_style.dart | 5 +++-- 10 files changed, 29 insertions(+), 9 deletions(-) diff --git a/lib/pages/chat/events/message/message_content_with_timestamp_builder.dart b/lib/pages/chat/events/message/message_content_with_timestamp_builder.dart index ba0f5f1a26..8e122d8e51 100644 --- a/lib/pages/chat/events/message/message_content_with_timestamp_builder.dart +++ b/lib/pages/chat/events/message/message_content_with_timestamp_builder.dart @@ -108,8 +108,12 @@ class MessageContentWithTimestampBuilder extends StatelessWidget { borderRadius: MessageStyle.bubbleBorderRadius, color: event.isOwnMessage ? LinagoraRefColors.material().primary[95] - : LinagoraSysColors.material().onPrimary, - border: !event.isOwnMessage + : responsiveUtils.isMobile(context) + ? LinagoraSysColors.material().onPrimary + : Theme.of(context) + .colorScheme + .surfaceContainerHighest, + border: !event.isOwnMessage && responsiveUtils.isMobile(context) ? Border.all( color: MessageStyle.borderColorReceivedBubble, ) diff --git a/lib/pages/chat/events/message_download_content.dart b/lib/pages/chat/events/message_download_content.dart index 6e7120f28c..137e7370df 100644 --- a/lib/pages/chat/events/message_download_content.dart +++ b/lib/pages/chat/events/message_download_content.dart @@ -55,6 +55,7 @@ class _MessageDownloadContentState extends State highlightText: widget.highlightText, sizeString: sizeString, style: const MessageFileTileStyle(), + ownMessage: event.isOwnMessage, ), ); } else if (state is DownloadingPresentationState || @@ -72,6 +73,7 @@ class _MessageDownloadContentState extends State const NotDownloadPresentationState(); downloadManager.cancelDownload(widget.event.eventId); }, + ownMessage: event.isOwnMessage, hasError: state is DownloadErrorPresentationState, ); } @@ -85,6 +87,7 @@ class _MessageDownloadContentState extends State highlightText: widget.highlightText, sizeString: sizeString, downloadFileStateNotifier: downloadFileStateNotifier, + ownMessage: event.isOwnMessage, style: const MessageFileTileStyle(), ), ); diff --git a/lib/pages/chat/events/message_download_content_web.dart b/lib/pages/chat/events/message_download_content_web.dart index 69d9992299..4d6fff2cbf 100644 --- a/lib/pages/chat/events/message_download_content_web.dart +++ b/lib/pages/chat/events/message_download_content_web.dart @@ -83,6 +83,7 @@ class _MessageDownloadContentWebState extends State const NotDownloadPresentationState(); downloadManager.cancelDownload(widget.event.eventId); }, + ownMessage: event.isOwnMessage, hasError: state is DownloadErrorPresentationState, ); } else if (state is FileWebDownloadedPresentationState) { @@ -101,6 +102,7 @@ class _MessageDownloadContentWebState extends State highlightText: widget.highlightText, sizeString: sizeString, style: const MessageFileTileStyle(), + ownMessage: event.isOwnMessage, ), ); } @@ -114,6 +116,7 @@ class _MessageDownloadContentWebState extends State highlightText: widget.highlightText, sizeString: sizeString, style: const MessageFileTileStyle(), + ownMessage: event.isOwnMessage, ), ); }, diff --git a/lib/pages/chat/events/message_upload_content.dart b/lib/pages/chat/events/message_upload_content.dart index 54e4161c00..3925ba30fd 100644 --- a/lib/pages/chat/events/message_upload_content.dart +++ b/lib/pages/chat/events/message_upload_content.dart @@ -32,7 +32,7 @@ class _MessageUploadingContentState extends State return Container( padding: widget.style.paddingFileTileAll, decoration: ShapeDecoration( - color: widget.style.backgroundColor, + color: widget.style.backgroundColor(context, ownMessage: event.isOwnMessage), shape: RoundedRectangleBorder( borderRadius: widget.style.borderRadius, ), diff --git a/lib/pages/chat_details/chat_details_page_view/files/chat_details_files_item/chat_details_files_item_style.dart b/lib/pages/chat_details/chat_details_page_view/files/chat_details_files_item/chat_details_files_item_style.dart index e59da2b683..490203aa65 100644 --- a/lib/pages/chat_details/chat_details_page_view/files/chat_details_files_item/chat_details_files_item_style.dart +++ b/lib/pages/chat_details/chat_details_page_view/files/chat_details_files_item/chat_details_files_item_style.dart @@ -8,7 +8,9 @@ class ChatDetailsFileTileStyle extends FileTileWidgetStyle { static const double textTopMargin = 4.0; @override - Color get backgroundColor => Colors.transparent; + Color backgroundColor(BuildContext context, {bool ownMessage = false}) { + return Colors.transparent; + } @override BorderRadiusGeometry get borderRadius => BorderRadius.circular(8); diff --git a/lib/widgets/file_widget/base_file_tile_widget.dart b/lib/widgets/file_widget/base_file_tile_widget.dart index d74393e9e8..d01f20ddc9 100644 --- a/lib/widgets/file_widget/base_file_tile_widget.dart +++ b/lib/widgets/file_widget/base_file_tile_widget.dart @@ -18,6 +18,7 @@ class BaseFileTileWidget extends StatelessWidget { this.fileTileIcon, this.imageBytes, this.style = const FileTileWidgetStyle(), + this.ownMessage = false, required this.subTitle, }); @@ -31,13 +32,14 @@ class BaseFileTileWidget extends StatelessWidget { final String? fileTileIcon; final FileTileWidgetStyle style; final Widget Function(BuildContext) subTitle; + final bool ownMessage; @override Widget build(BuildContext context) { return Container( padding: style.paddingFileTileAll, decoration: ShapeDecoration( - color: backgroundColor ?? style.backgroundColor, + color: backgroundColor ?? style.backgroundColor(context, ownMessage: ownMessage), shape: RoundedRectangleBorder( borderRadius: style.borderRadius, ), diff --git a/lib/widgets/file_widget/download_file_tile_widget.dart b/lib/widgets/file_widget/download_file_tile_widget.dart index 283e61b9fe..4344126913 100644 --- a/lib/widgets/file_widget/download_file_tile_widget.dart +++ b/lib/widgets/file_widget/download_file_tile_widget.dart @@ -17,6 +17,7 @@ class DownloadFileTileWidget extends StatelessWidget { this.sizeString, required this.downloadFileStateNotifier, this.onCancelDownload, + this.ownMessage = false, this.hasError = false, }); @@ -29,13 +30,14 @@ class DownloadFileTileWidget extends StatelessWidget { final ValueNotifier downloadFileStateNotifier; final VoidCallback? onCancelDownload; final bool hasError; + final bool ownMessage; @override Widget build(BuildContext context) { return Container( padding: style.paddingFileTileAll, decoration: ShapeDecoration( - color: style.backgroundColor, + color: style.backgroundColor(context, ownMessage: ownMessage), shape: RoundedRectangleBorder( borderRadius: style.borderRadius, ), diff --git a/lib/widgets/file_widget/downloading_file_tile_widget.dart b/lib/widgets/file_widget/downloading_file_tile_widget.dart index 9b4fb7a0ef..3c47f5fd3d 100644 --- a/lib/widgets/file_widget/downloading_file_tile_widget.dart +++ b/lib/widgets/file_widget/downloading_file_tile_widget.dart @@ -16,6 +16,7 @@ class DownloadingFileTileWidget extends StatelessWidget { this.fileType, this.sizeString, required this.downloadFileStateNotifier, + this.ownMessage = false, this.onCancelDownload, }); @@ -27,13 +28,14 @@ class DownloadingFileTileWidget extends StatelessWidget { final String? fileType; final ValueNotifier downloadFileStateNotifier; final VoidCallback? onCancelDownload; + final bool ownMessage; @override Widget build(BuildContext context) { return Container( padding: style.paddingFileTileAll, decoration: ShapeDecoration( - color: style.backgroundColor, + color: style.backgroundColor(context, ownMessage: ownMessage), shape: RoundedRectangleBorder( borderRadius: style.borderRadius, ), diff --git a/lib/widgets/file_widget/file_tile_widget.dart b/lib/widgets/file_widget/file_tile_widget.dart index d735406348..9e8bb82f73 100644 --- a/lib/widgets/file_widget/file_tile_widget.dart +++ b/lib/widgets/file_widget/file_tile_widget.dart @@ -17,6 +17,7 @@ class FileTileWidget extends BaseFileTileWidget { super.fileTileIcon, super.imageBytes, super.style = const FileTileWidgetStyle(), + super.ownMessage = false, }) : super( subTitle: (context) => Row( children: [ diff --git a/lib/widgets/file_widget/file_tile_widget_style.dart b/lib/widgets/file_widget/file_tile_widget_style.dart index f6dd83c08f..8074e6cf75 100644 --- a/lib/widgets/file_widget/file_tile_widget_style.dart +++ b/lib/widgets/file_widget/file_tile_widget_style.dart @@ -9,8 +9,9 @@ class FileTileWidgetStyle { EdgeInsets get paddingFileTileAll => const EdgeInsets.only(left: 8.0, right: 16.0); - Color get backgroundColor => - LinagoraSysColors.material().surfaceTint.withOpacity(0.08); + Color backgroundColor(BuildContext context, {bool ownMessage = false}) => ownMessage + ? Theme.of(context).colorScheme.primaryContainer + : Theme.of(context).colorScheme.onSurface.withOpacity(0.08); BorderRadiusGeometry get borderRadius => BorderRadius.circular(12);