mirror of
https://github.com/immich-app/immich
synced 2025-11-14 17:36:12 +00:00
feat(mobile): Memories activity is now full screen, better image fit, adds progress indicator (#6793)
* Made memories full screen * Uses linear bar and fits the card better for memories * Fixes pageview close button moving with pages * Uses hooks instead of stateful components * Adds ticks to the progress indicator * Rounds the edges of the progress bar * Fixes trailing comma analyze error * Adds padding and hero to memories * Fixes an issue with initial index set and adds hero / proper padding * Fixes aspect ratio calculation * Color --------- Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
parent
f6b4024a21
commit
c29976cd6f
5 changed files with 337 additions and 198 deletions
|
|
@ -12,18 +12,14 @@ import 'package:openapi/api.dart';
|
|||
class MemoryCard extends StatelessWidget {
|
||||
final Asset asset;
|
||||
final void Function() onTap;
|
||||
final void Function() onClose;
|
||||
final String title;
|
||||
final String? rightCornerText;
|
||||
final bool showTitle;
|
||||
|
||||
const MemoryCard({
|
||||
required this.asset,
|
||||
required this.onTap,
|
||||
required this.onClose,
|
||||
required this.title,
|
||||
required this.showTitle,
|
||||
this.rightCornerText,
|
||||
super.key,
|
||||
});
|
||||
|
||||
|
|
@ -65,34 +61,34 @@ class MemoryCard extends StatelessWidget {
|
|||
),
|
||||
GestureDetector(
|
||||
onTap: onTap,
|
||||
child: ImmichImage(
|
||||
asset,
|
||||
fit: BoxFit.fitWidth,
|
||||
height: double.infinity,
|
||||
width: double.infinity,
|
||||
type: ThumbnailFormat.JPEG,
|
||||
preferredLocalAssetSize: 2048,
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
top: 2.0,
|
||||
left: 2.0,
|
||||
child: IconButton(
|
||||
onPressed: onClose,
|
||||
icon: const Icon(Icons.close_rounded),
|
||||
color: Colors.grey[400],
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
right: 18.0,
|
||||
top: 18.0,
|
||||
child: Text(
|
||||
rightCornerText ?? "",
|
||||
style: TextStyle(
|
||||
color: Colors.grey[200],
|
||||
fontSize: 12.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
child: LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
// Determine the fit using the aspect ratio
|
||||
BoxFit fit = BoxFit.fitWidth;
|
||||
if (asset.width != null && asset.height != null) {
|
||||
final aspectRatio = asset.width! / asset.height!;
|
||||
final phoneAspectRatio =
|
||||
constraints.maxWidth / constraints.maxHeight;
|
||||
// Look for a 25% difference in either direction
|
||||
if (phoneAspectRatio * .75 < aspectRatio &&
|
||||
phoneAspectRatio * 1.25 > aspectRatio) {
|
||||
// Cover to look nice if we have nearly the same aspect ratio
|
||||
fit = BoxFit.cover;
|
||||
}
|
||||
}
|
||||
|
||||
return Hero(
|
||||
tag: 'memory-${asset.id}',
|
||||
child: ImmichImage(
|
||||
asset,
|
||||
fit: fit,
|
||||
height: double.infinity,
|
||||
width: double.infinity,
|
||||
type: ThumbnailFormat.JPEG,
|
||||
preferredLocalAssetSize: 2048,
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
if (showTitle)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue