Merge pull request #1709 from GetStream/fix/hidden-video-controls
This commit is contained in:
@@ -4,6 +4,8 @@
|
|||||||
|
|
||||||
- [[#1702]](https://github.com/GetStream/stream-chat-flutter/issues/1702)
|
- [[#1702]](https://github.com/GetStream/stream-chat-flutter/issues/1702)
|
||||||
Fixed `Message.replaceMentions` not treating `@usernames` as mentions.
|
Fixed `Message.replaceMentions` not treating `@usernames` as mentions.
|
||||||
|
- [[#1694]](https://github.com/GetStream/stream-chat-flutter/issues/1694) Fixed Video player buttons
|
||||||
|
getting covered by bottom toolbar.
|
||||||
|
|
||||||
✅ Added
|
✅ Added
|
||||||
|
|
||||||
|
|||||||
@@ -3,13 +3,11 @@ import 'dart:io';
|
|||||||
|
|
||||||
import 'package:cached_network_image/cached_network_image.dart';
|
import 'package:cached_network_image/cached_network_image.dart';
|
||||||
import 'package:chewie/chewie.dart';
|
import 'package:chewie/chewie.dart';
|
||||||
import 'package:contextmenu/contextmenu.dart';
|
|
||||||
import 'package:flutter/foundation.dart';
|
import 'package:flutter/foundation.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:photo_view/photo_view.dart';
|
import 'package:photo_view/photo_view.dart';
|
||||||
import 'package:shimmer/shimmer.dart';
|
import 'package:shimmer/shimmer.dart';
|
||||||
import 'package:stream_chat_flutter/platform_widget_builder/platform_widget_builder.dart';
|
import 'package:stream_chat_flutter/platform_widget_builder/platform_widget_builder.dart';
|
||||||
import 'package:stream_chat_flutter/src/context_menu_items/download_menu_item.dart';
|
|
||||||
import 'package:stream_chat_flutter/src/fullscreen_media/full_screen_media_widget.dart';
|
import 'package:stream_chat_flutter/src/fullscreen_media/full_screen_media_widget.dart';
|
||||||
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
||||||
import 'package:video_player/video_player.dart';
|
import 'package:video_player/video_player.dart';
|
||||||
@@ -281,32 +279,30 @@ class _FullScreenMediaState extends State<StreamFullScreenMedia> {
|
|||||||
final currentAttachmentPackage =
|
final currentAttachmentPackage =
|
||||||
widget.mediaAttachmentPackages[index];
|
widget.mediaAttachmentPackages[index];
|
||||||
final attachment = currentAttachmentPackage.attachment;
|
final attachment = currentAttachmentPackage.attachment;
|
||||||
if (attachment.type == 'image' || attachment.type == 'giphy') {
|
return ValueListenableBuilder(
|
||||||
final imageUrl = attachment.imageUrl ??
|
|
||||||
attachment.assetUrl ??
|
|
||||||
attachment.thumbUrl;
|
|
||||||
return ValueListenableBuilder<bool>(
|
|
||||||
valueListenable: _isDisplayingDetail,
|
valueListenable: _isDisplayingDetail,
|
||||||
builder: (context, isDisplayingDetail, _) =>
|
builder: (context, isDisplayingDetail, child) {
|
||||||
AnimatedContainer(
|
return AnimatedContainer(
|
||||||
|
duration: kThemeChangeDuration,
|
||||||
color: isDisplayingDetail
|
color: isDisplayingDetail
|
||||||
? StreamChannelHeaderTheme.of(context).color
|
? StreamChannelHeaderTheme.of(context).color
|
||||||
: Colors.black,
|
: Colors.black,
|
||||||
duration: kThemeAnimationDuration,
|
child: Builder(
|
||||||
child: ContextMenuArea(
|
builder: (context) {
|
||||||
verticalPadding: 0,
|
if (attachment.type == 'image' ||
|
||||||
builder: (_) => [
|
attachment.type == 'giphy') {
|
||||||
DownloadMenuItem(
|
final imageUrl = attachment.imageUrl ??
|
||||||
attachment: attachment,
|
attachment.assetUrl ??
|
||||||
),
|
attachment.thumbUrl;
|
||||||
],
|
|
||||||
child: PhotoView(
|
return PhotoView(
|
||||||
imageProvider: (imageUrl == null &&
|
imageProvider: (imageUrl == null &&
|
||||||
attachment.localUri != null &&
|
attachment.localUri != null &&
|
||||||
attachment.file?.bytes != null)
|
attachment.file?.bytes != null)
|
||||||
? Image.memory(attachment.file!.bytes!).image
|
? Image.memory(attachment.file!.bytes!).image
|
||||||
: CachedNetworkImageProvider(imageUrl!),
|
: CachedNetworkImageProvider(imageUrl!),
|
||||||
errorBuilder: (_, __, ___) => const AttachmentError(),
|
errorBuilder: (_, __, ___) =>
|
||||||
|
const AttachmentError(),
|
||||||
loadingBuilder: (context, _) {
|
loadingBuilder: (context, _) {
|
||||||
final image = Image.asset(
|
final image = Image.asset(
|
||||||
'images/placeholder.png',
|
'images/placeholder.png',
|
||||||
@@ -329,9 +325,6 @@ class _FullScreenMediaState extends State<StreamFullScreenMedia> {
|
|||||||
backgroundDecoration: const BoxDecoration(
|
backgroundDecoration: const BoxDecoration(
|
||||||
color: Colors.transparent,
|
color: Colors.transparent,
|
||||||
),
|
),
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
} else if (attachment.type == 'video') {
|
} else if (attachment.type == 'video') {
|
||||||
final controller = videoPackages[attachment.id]!;
|
final controller = videoPackages[attachment.id]!;
|
||||||
@@ -340,27 +333,31 @@ class _FullScreenMediaState extends State<StreamFullScreenMedia> {
|
|||||||
child: CircularProgressIndicator.adaptive(),
|
child: CircularProgressIndicator.adaptive(),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return InkWell(
|
|
||||||
onTap: switchDisplayingDetail,
|
final mediaQuery = MediaQuery.of(context);
|
||||||
child: Padding(
|
final bottomPadding = mediaQuery.padding.bottom;
|
||||||
padding: const EdgeInsets.symmetric(vertical: 50),
|
|
||||||
child: ContextMenuArea(
|
return AnimatedPadding(
|
||||||
verticalPadding: 0,
|
duration: kThemeChangeDuration,
|
||||||
builder: (_) => [
|
padding: EdgeInsets.symmetric(
|
||||||
DownloadMenuItem(
|
vertical: isDisplayingDetail
|
||||||
attachment: attachment,
|
? kToolbarHeight + bottomPadding
|
||||||
|
: 0,
|
||||||
),
|
),
|
||||||
],
|
|
||||||
child: Chewie(
|
child: Chewie(
|
||||||
controller: controller.chewieController!,
|
controller: controller.chewieController!,
|
||||||
),
|
),
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return const SizedBox();
|
return const SizedBox();
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@@ -475,6 +472,7 @@ class VideoPackage {
|
|||||||
videoPlayerController: _videoPlayerController,
|
videoPlayerController: _videoPlayerController,
|
||||||
autoInitialize: _autoInitialize,
|
autoInitialize: _autoInitialize,
|
||||||
showControls: _showControls,
|
showControls: _showControls,
|
||||||
|
showOptions: false,
|
||||||
aspectRatio: _videoPlayerController.value.aspectRatio,
|
aspectRatio: _videoPlayerController.value.aspectRatio,
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|||||||
+32
-25
@@ -307,32 +307,31 @@ class _FullScreenMediaDesktopState extends State<FullScreenMediaDesktop> {
|
|||||||
final currentAttachmentPackage =
|
final currentAttachmentPackage =
|
||||||
widget.mediaAttachmentPackages[index];
|
widget.mediaAttachmentPackages[index];
|
||||||
final attachment = currentAttachmentPackage.attachment;
|
final attachment = currentAttachmentPackage.attachment;
|
||||||
if (attachment.type == 'image' || attachment.type == 'giphy') {
|
|
||||||
final imageUrl = attachment.imageUrl ??
|
return ValueListenableBuilder(
|
||||||
attachment.assetUrl ??
|
|
||||||
attachment.thumbUrl;
|
|
||||||
return ValueListenableBuilder<bool>(
|
|
||||||
valueListenable: _isDisplayingDetail,
|
valueListenable: _isDisplayingDetail,
|
||||||
builder: (context, isDisplayingDetail, _) =>
|
builder: (context, isDisplayingDetail, child) {
|
||||||
AnimatedContainer(
|
return AnimatedContainer(
|
||||||
|
duration: kThemeChangeDuration,
|
||||||
color: isDisplayingDetail
|
color: isDisplayingDetail
|
||||||
? StreamChannelHeaderTheme.of(context).color
|
? StreamChannelHeaderTheme.of(context).color
|
||||||
: Colors.black,
|
: Colors.black,
|
||||||
duration: kThemeAnimationDuration,
|
child: Builder(
|
||||||
child: ContextMenuArea(
|
builder: (context) {
|
||||||
verticalPadding: 0,
|
if (attachment.type == 'image' ||
|
||||||
builder: (_) => [
|
attachment.type == 'giphy') {
|
||||||
DownloadMenuItem(
|
final imageUrl = attachment.imageUrl ??
|
||||||
attachment: attachment,
|
attachment.assetUrl ??
|
||||||
),
|
attachment.thumbUrl;
|
||||||
],
|
|
||||||
child: PhotoView(
|
return PhotoView(
|
||||||
imageProvider: (imageUrl == null &&
|
imageProvider: (imageUrl == null &&
|
||||||
attachment.localUri != null &&
|
attachment.localUri != null &&
|
||||||
attachment.file?.bytes != null)
|
attachment.file?.bytes != null)
|
||||||
? Image.memory(attachment.file!.bytes!).image
|
? Image.memory(attachment.file!.bytes!).image
|
||||||
: CachedNetworkImageProvider(imageUrl!),
|
: CachedNetworkImageProvider(imageUrl!),
|
||||||
errorBuilder: (_, __, ___) => const AttachmentError(),
|
errorBuilder: (_, __, ___) =>
|
||||||
|
const AttachmentError(),
|
||||||
loadingBuilder: (context, _) {
|
loadingBuilder: (context, _) {
|
||||||
final image = Image.asset(
|
final image = Image.asset(
|
||||||
'images/placeholder.png',
|
'images/placeholder.png',
|
||||||
@@ -355,9 +354,6 @@ class _FullScreenMediaDesktopState extends State<FullScreenMediaDesktop> {
|
|||||||
backgroundDecoration: const BoxDecoration(
|
backgroundDecoration: const BoxDecoration(
|
||||||
color: Colors.transparent,
|
color: Colors.transparent,
|
||||||
),
|
),
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
} else if (attachment.type == 'video') {
|
} else if (attachment.type == 'video') {
|
||||||
final package = videoPackages[attachment.id]!;
|
final package = videoPackages[attachment.id]!;
|
||||||
@@ -370,10 +366,16 @@ class _FullScreenMediaDesktopState extends State<FullScreenMediaDesktop> {
|
|||||||
autoStart: widget.autoplayVideos,
|
autoStart: widget.autoplayVideos,
|
||||||
);
|
);
|
||||||
|
|
||||||
return InkWell(
|
final mediaQuery = MediaQuery.of(context);
|
||||||
onTap: switchDisplayingDetail,
|
final bottomPadding = mediaQuery.padding.bottom;
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(vertical: 50),
|
return AnimatedPadding(
|
||||||
|
duration: kThemeChangeDuration,
|
||||||
|
padding: EdgeInsets.symmetric(
|
||||||
|
vertical: isDisplayingDetail
|
||||||
|
? kToolbarHeight + bottomPadding
|
||||||
|
: 0,
|
||||||
|
),
|
||||||
child: ContextMenuArea(
|
child: ContextMenuArea(
|
||||||
verticalPadding: 0,
|
verticalPadding: 0,
|
||||||
builder: (_) => [
|
builder: (_) => [
|
||||||
@@ -385,12 +387,17 @@ class _FullScreenMediaDesktopState extends State<FullScreenMediaDesktop> {
|
|||||||
player: package.player,
|
player: package.player,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return const SizedBox();
|
return const SizedBox();
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user