Add name of pokemon under its image
This commit is contained in:
parent
9ee9d5af0e
commit
8419c74f5f
@ -10,6 +10,7 @@ import androidx.compose.foundation.layout.fillMaxSize
|
|||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
import androidx.compose.foundation.layout.height
|
import androidx.compose.foundation.layout.height
|
||||||
import androidx.compose.foundation.layout.padding
|
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.GridCells
|
||||||
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
|
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
|
||||||
import androidx.compose.foundation.lazy.grid.items
|
import androidx.compose.foundation.lazy.grid.items
|
||||||
@ -62,6 +63,7 @@ fun PokeSearch(pokeSearchViewModel: PokeSearchViewModel) {
|
|||||||
if (results.isNotEmpty()) {
|
if (results.isNotEmpty()) {
|
||||||
LazyVerticalGrid(
|
LazyVerticalGrid(
|
||||||
columns = GridCells.Adaptive(150.dp),
|
columns = GridCells.Adaptive(150.dp),
|
||||||
|
verticalArrangement = Arrangement.spacedBy(10.dp)
|
||||||
) {
|
) {
|
||||||
items(items = results, key = { pokemon -> pokemon.id }) { pokemon ->
|
items(items = results, key = { pokemon -> pokemon.id }) { pokemon ->
|
||||||
PokemonCard(pokemon)
|
PokemonCard(pokemon)
|
||||||
@ -85,13 +87,28 @@ fun PokemonCard(pokemon: PokemonDetails) {
|
|||||||
.fillMaxWidth()
|
.fillMaxWidth()
|
||||||
.aspectRatio(1f)
|
.aspectRatio(1f)
|
||||||
) {
|
) {
|
||||||
AsyncImage(
|
Column(
|
||||||
model = ImageRequest.Builder(context = LocalContext.current).data(pokemon.sprites.other.officialArtwork.frontDefault)
|
modifier = Modifier.fillMaxSize(),
|
||||||
.crossfade(true).build(),
|
verticalArrangement = Arrangement.Bottom
|
||||||
contentDescription = pokemon.name,
|
) {
|
||||||
contentScale = ContentScale.Crop,
|
AsyncImage(
|
||||||
modifier = Modifier.fillMaxWidth()
|
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)
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user