1
0
mirror of https://github.com/immich-app/immich.git synced 2024-12-25 10:43:13 +02:00

feat(mobile): enable zoom of preview images & reuse cached thumbnails (#1049)

This commit is contained in:
Fynn Petersen-Frey 2022-12-04 04:59:39 +01:00 committed by GitHub
parent 99854e90be
commit 83c7434eb5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 37 additions and 17 deletions

View File

@ -1,5 +1,3 @@
import 'dart:math';
import 'package:auto_route/auto_route.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:easy_localization/easy_localization.dart';
@ -41,7 +39,6 @@ class AlbumThumbnailCard extends StatelessWidget {
buildAlbumThumbnail() {
return CachedNetworkImage(
memCacheHeight: max(400, cardSize.toInt() * 3),
width: cardSize,
height: cardSize,
fit: BoxFit.cover,
@ -51,7 +48,7 @@ class AlbumThumbnailCard extends StatelessWidget {
type: ThumbnailFormat.JPEG,
),
httpHeaders: {"Authorization": "Bearer ${box.get(accessTokenKey)}"},
cacheKey: "${album.albumThumbnailAssetId}",
cacheKey: getAlbumThumbNailCacheKey(album, type: ThumbnailFormat.JPEG),
);
}

View File

@ -42,10 +42,9 @@ class SharingPage extends HookConsumerWidget {
child: CachedNetworkImage(
width: 60,
height: 60,
memCacheHeight: 200,
fit: BoxFit.cover,
imageUrl: getAlbumThumbnailUrl(album),
cacheKey: album.albumThumbnailAssetId,
cacheKey: getAlbumThumbNailCacheKey(album),
httpHeaders: {
"Authorization": "Bearer ${box.get(accessTokenKey)}"
},

View File

@ -20,10 +20,10 @@ class _RemotePhotoViewState extends State<RemotePhotoView> {
@override
Widget build(BuildContext context) {
bool allowMoving = _status == _RemoteImageStatus.full;
final bool forbidZoom = _status == _RemoteImageStatus.thumbnail;
return IgnorePointer(
ignoring: !allowMoving,
ignoring: forbidZoom,
child: Listener(
onPointerMove: handleSwipUpDown,
child: PhotoView(
@ -115,7 +115,7 @@ class _RemotePhotoViewState extends State<RemotePhotoView> {
_thumbnailProvider = _authorizedImageProvider(
getThumbnailUrl(widget.asset.remote!),
widget.asset.id,
getThumbnailCacheKey(widget.asset.remote!),
);
_imageProvider = _thumbnailProvider;
@ -131,7 +131,7 @@ class _RemotePhotoViewState extends State<RemotePhotoView> {
if (widget.loadPreview) {
_previewProvider = _authorizedImageProvider(
getThumbnailUrl(widget.asset.remote!, type: ThumbnailFormat.JPEG),
"${widget.asset.id}_previewStage",
getThumbnailCacheKey(widget.asset.remote!, type: ThumbnailFormat.JPEG),
);
_previewProvider.resolve(const ImageConfiguration()).addListener(
ImageStreamListener((ImageInfo imageInfo, _) {
@ -143,7 +143,7 @@ class _RemotePhotoViewState extends State<RemotePhotoView> {
if (widget.loadOriginal) {
_fullProvider = _authorizedImageProvider(
getImageUrl(widget.asset.remote!),
"${widget.asset.id}_fullStage",
getImageCacheKey(widget.asset.remote!),
);
_fullProvider.resolve(const ImageConfiguration()).addListener(
ImageStreamListener((ImageInfo imageInfo, _) {

View File

@ -75,14 +75,11 @@ class ControlBottomAppBar extends ConsumerWidget {
width: 100,
height: 100,
fit: BoxFit.cover,
imageUrl: getAlbumThumbnailUrl(
album,
type: ThumbnailFormat.JPEG,
),
imageUrl: getAlbumThumbnailUrl(album),
httpHeaders: {
"Authorization": "Bearer ${box.get(accessTokenKey)}"
},
cacheKey: "${album.albumThumbnailAssetId}",
cacheKey: getAlbumThumbNailCacheKey(album),
),
),
Padding(

View File

@ -62,7 +62,7 @@ class ImmichImage extends StatelessWidget {
return CachedNetworkImage(
imageUrl: thumbnailRequestUrl,
httpHeaders: {"Authorization": "Bearer $token"},
cacheKey: 'thumbnail-image-${asset.id}',
cacheKey: getThumbnailCacheKey(asset.remote!),
width: width,
height: height,
// keeping memCacheWidth, memCacheHeight, maxWidthDiskCache and

View File

@ -10,6 +10,19 @@ String getThumbnailUrl(
return _getThumbnailUrl(asset.id, type: type);
}
String getThumbnailCacheKey(final AssetResponseDto asset,
{ThumbnailFormat type = ThumbnailFormat.WEBP}) {
return _getThumbnailCacheKey(asset.id, type);
}
String _getThumbnailCacheKey(final String id, final ThumbnailFormat type) {
if (type == ThumbnailFormat.WEBP) {
return 'thumbnail-image-$id';
} else {
return '${id}_previewStage';
}
}
String getAlbumThumbnailUrl(
final AlbumResponseDto album, {
ThumbnailFormat type = ThumbnailFormat.WEBP,
@ -20,11 +33,25 @@ String getAlbumThumbnailUrl(
return _getThumbnailUrl(album.albumThumbnailAssetId!, type: type);
}
String getAlbumThumbNailCacheKey(
final AlbumResponseDto album, {
ThumbnailFormat type = ThumbnailFormat.WEBP,
}) {
if (album.albumThumbnailAssetId == null) {
return '';
}
return _getThumbnailCacheKey(album.albumThumbnailAssetId!, type);
}
String getImageUrl(final AssetResponseDto asset) {
final box = Hive.box(userInfoBox);
return '${box.get(serverEndpointKey)}/asset/file/${asset.id}?isThumb=false';
}
String getImageCacheKey(final AssetResponseDto asset) {
return '${asset.id}_fullStage';
}
String _getThumbnailUrl(
final String id, {
ThumbnailFormat type = ThumbnailFormat.WEBP,