From 8419c74f5fae54ec374cf31410a58772f3f13f99 Mon Sep 17 00:00:00 2001
From: Joren <joren.schipman@student.howest.be>
Date: Mon, 29 Apr 2024 18:00:35 +0200
Subject: [PATCH] Add name of pokemon under its image

---
 .../com/ti/mobpo/ui/screens/PokeSearch.kt     | 31 ++++++++++++++-----
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/app/src/main/java/com/ti/mobpo/ui/screens/PokeSearch.kt b/app/src/main/java/com/ti/mobpo/ui/screens/PokeSearch.kt
index e43013c..cffe645 100644
--- a/app/src/main/java/com/ti/mobpo/ui/screens/PokeSearch.kt
+++ b/app/src/main/java/com/ti/mobpo/ui/screens/PokeSearch.kt
@@ -10,6 +10,7 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
@@ -62,6 +63,7 @@ fun PokeSearch(pokeSearchViewModel: PokeSearchViewModel) {
             if (results.isNotEmpty()) {
                 LazyVerticalGrid(
                     columns = GridCells.Adaptive(150.dp),
+                    verticalArrangement = Arrangement.spacedBy(10.dp)
                 ) {
                     items(items = results, key = { pokemon -> pokemon.id }) { pokemon ->
                         PokemonCard(pokemon)
@@ -85,13 +87,28 @@ fun PokemonCard(pokemon: PokemonDetails) {
             .fillMaxWidth()
             .aspectRatio(1f)
     ) {
-        AsyncImage(
-            model = ImageRequest.Builder(context = LocalContext.current).data(pokemon.sprites.other.officialArtwork.frontDefault)
-                .crossfade(true).build(),
-            contentDescription = pokemon.name,
-            contentScale = ContentScale.Crop,
-            modifier = Modifier.fillMaxWidth()
-        )
+        Column(
+            modifier = Modifier.fillMaxSize(),
+            verticalArrangement = Arrangement.Bottom
+        ) {
+            AsyncImage(
+                model = ImageRequest.Builder(context = LocalContext.current).data(pokemon.sprites.other.officialArtwork.frontDefault)
+                    .crossfade(true).build(),
+                contentDescription = pokemon.name,
+                contentScale = ContentScale.Crop,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .weight(1f)
+            )
+            Text(
+                text = pokemon.name.replace("-", " "),
+                style = MaterialTheme.typography.bodySmall,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(horizontal = 8.dp, vertical = 4.dp) // Adjust padding as needed
+                    .wrapContentSize(Alignment.Center)
+            )
+        }
     }
 }