Change the BookDetail layout.

This commit is contained in:
Thomas Andres Gomez 2021-05-09 10:55:34 +02:00
parent f1043e75af
commit 9941777497
3 changed files with 10 additions and 13 deletions

View file

@ -9,8 +9,6 @@ import androidx.compose.material.Text
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.NavigateNext import androidx.compose.material.icons.filled.NavigateNext
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.ColorFilter import androidx.compose.ui.graphics.ColorFilter
@ -24,7 +22,6 @@ import com.pixelized.biblib.data.ui.BookThumbnailUio
import com.pixelized.biblib.ui.theme.BibLibTheme import com.pixelized.biblib.ui.theme.BibLibTheme
import com.pixelized.biblib.ui.theme.Teal200 import com.pixelized.biblib.ui.theme.Teal200
import com.pixelized.biblib.utils.BitmapCache import com.pixelized.biblib.utils.BitmapCache
import com.pixelized.biblib.utils.extention.toImage
import com.pixelized.biblib.utils.injection.Bob import com.pixelized.biblib.utils.injection.Bob
import com.pixelized.biblib.utils.mock.BookThumbnailMock import com.pixelized.biblib.utils.mock.BookThumbnailMock
@ -65,7 +62,7 @@ fun BookThumbnailComposable(
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically
) { ) {
Image( Image(
modifier = Modifier contentModifier = Modifier
.width(60.dp) .width(60.dp)
.height(96.dp), .height(96.dp),
placeHolder = painterResource(id = R.drawable.ic_launcher_foreground), placeHolder = painterResource(id = R.drawable.ic_launcher_foreground),

View file

@ -1,10 +1,8 @@
package com.pixelized.biblib.ui.composable.items package com.pixelized.biblib.ui.composable.items
import androidx.compose.animation.Crossfade import androidx.compose.animation.Crossfade
import androidx.compose.animation.core.MutableTransitionState
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
@ -21,6 +19,7 @@ fun Image(
contentUrl: URL, contentUrl: URL,
contentDescription: String?, contentDescription: String?,
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
contentModifier: Modifier = Modifier,
alignment: Alignment = Alignment.Center, alignment: Alignment = Alignment.Center,
contentScale: ContentScale = ContentScale.Fit, contentScale: ContentScale = ContentScale.Fit,
alpha: Float = DefaultAlpha, alpha: Float = DefaultAlpha,
@ -28,12 +27,12 @@ fun Image(
) { ) {
val cover by remember { contentUrl.toImage(placeHolder) } val cover by remember { contentUrl.toImage(placeHolder) }
Crossfade(targetState = cover) { Crossfade(modifier = modifier, targetState = cover) {
if (it == placeHolder) { if (it == placeHolder) {
androidx.compose.foundation.Image( androidx.compose.foundation.Image(
painter = placeHolder, painter = placeHolder,
contentDescription = contentDescription, contentDescription = contentDescription,
modifier = modifier, modifier = contentModifier,
alignment = alignment, alignment = alignment,
contentScale = contentScale, contentScale = contentScale,
alpha = alpha, alpha = alpha,
@ -43,7 +42,7 @@ fun Image(
androidx.compose.foundation.Image( androidx.compose.foundation.Image(
painter = cover, painter = cover,
contentDescription = contentDescription, contentDescription = contentDescription,
modifier = modifier, modifier = contentModifier,
alignment = alignment, alignment = alignment,
contentScale = contentScale, contentScale = contentScale,
alpha = alpha, alpha = alpha,

View file

@ -37,11 +37,12 @@ fun DetailPageComposable(book: BookUio) {
.padding(horizontal = 16.dp) .padding(horizontal = 16.dp)
) { ) {
Image( Image(
modifier = Modifier modifier = Modifier.align(Alignment.CenterHorizontally),
.fillMaxWidth() contentModifier = Modifier
.wrapContentHeight() .wrapContentWidth()
.height(480.dp)
.padding(vertical = 16.dp), .padding(vertical = 16.dp),
contentScale = ContentScale.FillWidth, contentScale = ContentScale.FillHeight,
placeHolder = painterResource(id = R.drawable.ic_launcher_foreground), placeHolder = painterResource(id = R.drawable.ic_launcher_foreground),
contentUrl = book.cover, contentUrl = book.cover,
colorFilter = if (MaterialTheme.colors.isLight) ColorFilter.tint(Teal200) else null, colorFilter = if (MaterialTheme.colors.isLight) ColorFilter.tint(Teal200) else null,