Initial WIP for practice 6

1 files changed, 72 insertions, 0 deletions

diff --git a/lib/widgets/album_item.dart b/lib/widgets/album_item.dart
new file mode 100644
index 0000000..8794c24
--- /dev/null
+++ b/lib/widgets/album_item.dart
@@ -0,0 +1,72 @@
+import 'package:flutter/material.dart';
+import 'package:pmsna1/models/album.dart';
+import 'package:pmsna1/widgets/album_placeholder.dart';
+
+class AlbumItem extends StatelessWidget {
+  final Album album;
+
+  const AlbumItem(this.album, {super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    Color textColor = Theme.of(context).colorScheme.onSurface;
+    return Card(
+      margin: const EdgeInsets.all(5.0),
+      semanticContainer: true,
+      clipBehavior: Clip.antiAliasWithSaveLayer,
+      child: InkWell(
+        onTap: () {
+          Navigator.of(context).pushNamed('/album', arguments: album);
+        },
+        child: Column(
+          children: [
+            FadeInImage(
+              placeholder: const AssetImage('assets/loading.gif'),
+              imageErrorBuilder: (context, error, stackTrace) =>
+                  const AspectRatio(
+                aspectRatio: 1.0,
+                child: AlbumPlaceholder(400),
+              ),
+              image: NetworkImage(album.coverUri.toString()),
+              fit: BoxFit.fill,
+            ),
+            Padding(
+              padding: const EdgeInsets.all(8.0),
+              child: Column(
+                children: [
+                  Text(
+                    album.title,
+                    style: Theme.of(context)
+                        .typography
+                        .englishLike
+                        .labelLarge
+                        ?.copyWith(color: textColor),
+                    textAlign: TextAlign.center,
+                  ),
+                  const SizedBox(height: 4.0),
+                  Text(
+                    album.firstReleaseDate,
+                    style: Theme.of(context)
+                        .typography
+                        .englishLike
+                        .labelMedium
+                        ?.copyWith(color: textColor),
+                  ),
+                  const SizedBox(height: 4.0),
+                  Text(
+                    "(${album.primaryType})",
+                    style: Theme.of(context)
+                        .typography
+                        .englishLike
+                        .labelSmall
+                        ?.copyWith(color: textColor),
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}