From c91da8ed7706559991aa89ab743df404f1445193 Mon Sep 17 00:00:00 2001 From: Quffik <8903maks127@gmail.com> Date: Thu, 23 Jul 2026 10:30:37 +0300 Subject: [PATCH 1/2] Update chat video thumbnail layout --- lib/pages/chat/events/video_player.dart | 105 +++++++++++------------- 1 file changed, 47 insertions(+), 58 deletions(-) diff --git a/lib/pages/chat/events/video_player.dart b/lib/pages/chat/events/video_player.dart index ab21782ab..2ba86abb1 100644 --- a/lib/pages/chat/events/video_player.dart +++ b/lib/pages/chat/events/video_player.dart @@ -46,9 +46,7 @@ class EventVideoPlayer extends StatelessWidget { @override Widget build(BuildContext context) { - final supportsVideoPlayer = PlatformInfos.supportsVideoPlayer; - - final hardCorner = Radius.circular(2); + final hardCorner = const Radius.circular(2); final roundedCorner = Radius.circular(AppConfig.borderRadius - 2); var borderRadius = BorderRadius.all(roundedCorner); @@ -140,38 +138,55 @@ class EventVideoPlayer extends StatelessWidget { aspectRatio: aspectRatio, child: Stack( children: [ - if (event.hasThumbnail && loadThumbnail) - MxcImage( - event: event, - uri: event.thumbnailMxcUrl, - isThumbnail: true, - width: bubbleWidth, - // height: width * aspectRatio, - fit: BoxFit.cover, - placeholder: (context) => LayoutBuilder( - builder: (context, constraints) => BlurHash( + event.hasThumbnail && loadThumbnail + ? MxcImage( + event: event, + isThumbnail: true, + width: bubbleWidth, + fit: BoxFit.cover, + placeholder: (context) => LayoutBuilder( + builder: (context, constraints) => BlurHash( + blurhash: blurHash, + width: constraints.maxWidth, + height: constraints.maxHeight, + fit: BoxFit.cover, + ), + ), + ) + : BlurHash( blurhash: blurHash, - width: constraints.maxWidth, - height: constraints.maxHeight, + width: bubbleWidth, + height: bubbleWidth / aspectRatio, fit: BoxFit.cover, ), + if (duration != null || sizeInt != null) + Positioned( + bottom: 3, + left: 4, + child: DecoratedBox( + decoration: BoxDecoration( + color: Colors.black.withValues(alpha: 0.35), + borderRadius: BorderRadius.circular(10), + ), + child: Padding( + padding: const .symmetric( + horizontal: 6, + vertical: 2, + ), + child: Text( + '${duration != null ? '${duration.inMinutes.toString().padLeft(2, '0')}:${(duration.inSeconds % 60).toString().padLeft(2, '0')}' : ''}${duration != null && sizeInt != null ? ' • ' : ''}${sizeInt?.sizeString ?? ''}', + style: const TextStyle( + color: Colors.white, + fontSize: 11, + height: 1.0, + ), + ), + ), ), - ) - else - BlurHash( - blurhash: blurHash, - width: bubbleWidth, - height: bubbleWidth * aspectRatio, - fit: BoxFit.cover, ), Center( - // child: CircleAvatar( - // child: supportsVideoPlayer - // ? const Icon(Icons.play_arrow_outlined) - // : const Icon(Icons.file_download_outlined), - // ), - child: FilledButton.tonal( - onPressed: () => supportsVideoPlayer + child: IconButton.filledTonal( + onPressed: () => PlatformInfos.supportsVideoPlayer ? showDialog( context: context, useRootNavigator: false, @@ -182,38 +197,12 @@ class EventVideoPlayer extends StatelessWidget { ), ) : event.saveFile(context), - child: Row( - mainAxisSize: .min, - children: [ - supportsVideoPlayer - ? const Icon(Icons.play_arrow_outlined) - : const Icon(Icons.file_download_outlined), - const SizedBox(width: 12), - Text( - supportsVideoPlayer - ? sizeInt == null - ? L10n.of(context).playVideoNoSize - : sizeInt.sizeString - : sizeInt == null - ? L10n.of(context).downloadVideoNoSize - : sizeInt.sizeString, - ), - ], + style: IconButton.styleFrom( + backgroundColor: Colors.black.withValues(alpha: 0.6), ), + icon: const Icon(Icons.play_arrow_outlined), ), ), - if (duration != null) - Positioned( - bottom: 8, - left: 16, - child: Text( - '${duration.inMinutes.toString().padLeft(2, '0')}:${(duration.inSeconds % 60).toString().padLeft(2, '0')}', - style: TextStyle( - color: Colors.white, - backgroundColor: Colors.black.withAlpha(32), - ), - ), - ), ], ), ), From fdcca354e9208227fe5d87e278f136817e6aecad Mon Sep 17 00:00:00 2001 From: Quffik <8903maks127@gmail.com> Date: Thu, 23 Jul 2026 11:18:15 +0300 Subject: [PATCH 2/2] Dynamic icon + White color --- lib/pages/chat/events/video_player.dart | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/lib/pages/chat/events/video_player.dart b/lib/pages/chat/events/video_player.dart index 2ba86abb1..6a94e75d0 100644 --- a/lib/pages/chat/events/video_player.dart +++ b/lib/pages/chat/events/video_player.dart @@ -46,6 +46,7 @@ class EventVideoPlayer extends StatelessWidget { @override Widget build(BuildContext context) { + final supportsVideoPlayer = PlatformInfos.supportsVideoPlayer; final hardCorner = const Radius.circular(2); final roundedCorner = Radius.circular(AppConfig.borderRadius - 2); @@ -186,7 +187,7 @@ class EventVideoPlayer extends StatelessWidget { ), Center( child: IconButton.filledTonal( - onPressed: () => PlatformInfos.supportsVideoPlayer + onPressed: () => supportsVideoPlayer ? showDialog( context: context, useRootNavigator: false, @@ -200,7 +201,15 @@ class EventVideoPlayer extends StatelessWidget { style: IconButton.styleFrom( backgroundColor: Colors.black.withValues(alpha: 0.6), ), - icon: const Icon(Icons.play_arrow_outlined), + icon: supportsVideoPlayer + ? const Icon( + Icons.play_arrow_outlined, + color: Colors.white, + ) + : const Icon( + Icons.file_download_outlined, + color: Colors.white, + ), ), ), ],