Make non-square album art display better on "Albums" (#579)

Fixes #200
ubuntu-flutter-community · Mar 11, 2024 · 0755cdb · 0755cdb
1 parent 13d4f89
commit 0755cdb
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 18 deletions.
diff --git a/assets/images/media-optical.png b/assets/images/media-optical.png
diff --git a/lib/src/common/audio_card.dart b/lib/src/common/audio_card.dart
@@ -20,8 +20,10 @@ class AudioCard extends StatefulWidget {
     this.width,
     this.color,
     this.showBorder = true,
+    this.background,
   });
   final Widget? image;
+  final Widget? background;
   final void Function()? onTap;
   final void Function()? onPlay;
   final Widget? bottom;
@@ -56,7 +58,8 @@ class _AudioCardState extends State<AudioCard> {
             borderRadius: BorderRadius.circular(10),
             child: Stack(
               children: [
-                if (widget.image == null)
+                if (widget.background != null) widget.background!,
+                if (widget.image == null && widget.background != null)
                   Shimmer.fromColors(
                     baseColor: light ? kCardColorLight : kCardColorDark,
                     highlightColor: light

diff --git a/lib/src/local_audio/album_page.dart b/lib/src/local_audio/album_page.dart
@@ -1,5 +1,6 @@
 import 'dart:typed_data';
 
+import 'package:collection/collection.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 
@@ -52,13 +53,20 @@ class AlbumPage extends ConsumerWidget {
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     final model = ref.read(localAudioModelProvider);
-    final image = album.firstOrNull?.pictureData != null
-        ? Image.memory(
-            album.firstOrNull!.pictureData!,
+    final pictureData =
+        album.firstWhereOrNull((e) => e.pictureData != null)?.pictureData;
+
+    final image = Stack(
+      children: [
+        Image.asset('assets/images/media-optical.png'),
+        if (pictureData != null)
+          Image.memory(
+            pictureData,
             fit: BoxFit.fitHeight,
             filterQuality: FilterQuality.medium,
-          )
-        : null;
+          ),
+      ],
+    );
 
     void onArtistTap(text) {
       final artistName = album.firstOrNull?.artist;

diff --git a/lib/src/local_audio/album_view.dart b/lib/src/local_audio/album_view.dart
@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 
-import '../../build_context_x.dart';
 import '../../common.dart';
 import '../../constants.dart';
 import '../../library.dart';
@@ -25,8 +24,6 @@ class AlbumsView extends ConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    final theme = context.t;
-
     if (albums == null) {
       return const Center(
         child: Progress(),
@@ -56,20 +53,20 @@ class AlbumsView extends ConsumerWidget {
           final albumAudios = model.findAlbum(audio);
 
           final image = audio.pictureData == null
-              ? Center(
-                  child: Icon(
-                    Iconz().musicNote,
-                    size: 70,
-                    color: theme.hintColor,
-                  ),
-                )
+              ? null
               : Image.memory(
                   audio.pictureData!,
-                  fit: BoxFit.cover,
+                  fit: BoxFit.fitHeight,
                   height: kAudioCardDimension,
                   filterQuality: FilterQuality.medium,
                 );
 
+          final fallback = Image.asset(
+            'assets/images/media-optical.png',
+            height: kAudioCardDimension,
+            width: kAudioCardDimension,
+          );
+
           return AudioCard(
             bottom: Align(
               alignment: Alignment.bottomCenter,
@@ -79,7 +76,8 @@ class AlbumsView extends ConsumerWidget {
                     : audio.album ?? '',
               ),
             ),
-            image: image,
+            image: image ?? fallback,
+            background: fallback,
             onTap: id == null || albumAudios == null
                 ? null
                 : () => Navigator.of(context).push(

diff --git a/pubspec.yaml b/pubspec.yaml
@@ -79,6 +79,7 @@ flutter:
   uses-material-design: true
   assets:
     - snap/gui/musicpod.png
+    - assets/images/media-optical.png
 
 dependency_overrides:
   intl: 0.19.0