Infrastructure/immich
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-02-04 01:09:14 -05:00
Code Issues Activity

feat(mobile): Tap to enter immersive mode on gallery viewer (#1546)

Browse source
This commit is contained in:
martyfuhry 2023-02-05 07:57:07 -05:00 • committed by GitHub
parent bb0b2a1f53
commit f38c7a4b7e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
mobile/lib/modules/asset_viewer/views/gallery_viewer.dart
View file

@ -52,6 +52,7 @@ class GalleryViewerPage extends HookConsumerWidget {
final showAppBar = useState<bool>(true);
final indexOfAsset = useState(assetList.indexOf(asset));
final isPlayingMotionVideo = useState(false);
final isPlayingVideo = useState(false);
late Offset localPosition;
final authToken = 'Bearer ${box.get(accessTokenKey)}';
@ -233,9 +234,13 @@ class GalleryViewerPage extends HookConsumerWidget {
}
buildAppBar() {
final show = (showAppBar.value || // onTap has the final say
(showAppBar.value && !isZoomed.value)) &&
!isPlayingVideo.value;
return AnimatedOpacity(
duration: const Duration(milliseconds: 100),
opacity: (showAppBar.value || !isZoomed.value) ? 1.0 : 0.0,
opacity: show ? 1.0 : 0.0,
child: Container(
color: Colors.black.withOpacity(0.4),
child: TopControlAppBar(
@ -312,8 +317,14 @@ class GalleryViewerPage extends HookConsumerWidget {
// Use the WEBP Thumbnail as a placeholder for the JPEG thumbnail to acheive
// Three-Stage Loading (WEBP -> JPEG -> Original)
final webPThumbnail = CachedNetworkImage(
imageUrl: getThumbnailUrl(asset),
cacheKey: getThumbnailCacheKey(asset),
imageUrl: getThumbnailUrl(
asset,
type: api.ThumbnailFormat.WEBP,
),
cacheKey: getThumbnailCacheKey(
asset,
type: api.ThumbnailFormat.WEBP,
),
httpHeaders: {'Authorization': authToken},
progressIndicatorBuilder: (_, __, ___) => const Center(
child: ImmichLoadingIndicator(),
@ -377,14 +388,14 @@ class GalleryViewerPage extends HookConsumerWidget {
onDragStart: (_, details, __) =>
localPosition = details.localPosition,
onDragUpdate: (_, details, __) => handleSwipeUpDown(details),
onTapDown: (_, __, ___) =>
showAppBar.value = !showAppBar.value,
heroAttributes:
PhotoViewHeroAttributes(tag: assetList[index].id),
maxScale: 1.0,
minScale: 1.0,
child: SafeArea(
child: VideoViewerPage(
onPlaying: () => isPlayingVideo.value = true,
onPaused: () => isPlayingVideo.value = false,
asset: assetList[index],
isMotionVideo: isPlayingMotionVideo.value,
onVideoEnded: () {

16
mobile/lib/modules/asset_viewer/views/video_viewer_page.dart
View file

@ -17,12 +17,16 @@ class VideoViewerPage extends HookConsumerWidget {
final Asset asset;
final bool isMotionVideo;
final VoidCallback onVideoEnded;
final VoidCallback? onPlaying;
final VoidCallback? onPaused;
const VideoViewerPage({
Key? key,
required this.asset,
required this.isMotionVideo,
required this.onVideoEnded,
this.onPlaying,
this.onPaused,
}) : super(key: key);
@override
@ -63,6 +67,8 @@ class VideoViewerPage extends HookConsumerWidget {
jwtToken: jwtToken,
isMotionVideo: isMotionVideo,
onVideoEnded: onVideoEnded,
onPaused: onPaused,
onPlaying: onPlaying,
),
if (downloadAssetStatus == DownloadAssetStatus.loading)
const Center(
@ -89,6 +95,9 @@ class VideoThumbnailPlayer extends StatefulWidget {
final bool isMotionVideo;
final VoidCallback onVideoEnded;
final Function()? onPlaying;
final Function()? onPaused;
const VideoThumbnailPlayer({
Key? key,
this.url,
@ -96,6 +105,8 @@ class VideoThumbnailPlayer extends StatefulWidget {
this.file,
required this.onVideoEnded,
required this.isMotionVideo,
this.onPlaying,
this.onPaused,
}) : super(key: key);
@override
@ -112,6 +123,11 @@ class _VideoThumbnailPlayerState extends State<VideoThumbnailPlayer> {
initializePlayer();
videoPlayerController.addListener(() {
if (videoPlayerController.value.isPlaying) {
widget.onPlaying?.call();
} else if (!videoPlayerController.value.isPlaying) {
widget.onPaused?.call();
}
if (videoPlayerController.value.position ==
videoPlayerController.value.duration) {
widget.onVideoEnded();