Skip to content

Commit

Permalink
이미지 상태 노출 처리 수정
Browse files Browse the repository at this point in the history
  • Loading branch information
@Pluu
Pluu committed Mar 23, 2024
1 parent 7b9e48e commit ab4c07d
Show file tree
Hide file tree
Showing 2 changed files with 50 additions and 92 deletions.
76 changes: 25 additions & 51 deletions features/ui-episode/src/main/java/com/pluu/webtoon/episode/ui/compose/EpisodeItemUi.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,13 @@ import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.sizeIn
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
Expand All @@ -40,7 +43,6 @@ import com.pluu.webtoon.episode.R
import com.pluu.webtoon.episode.compose.ImageInCircle
import com.pluu.webtoon.model.EpisodeInfo
import com.pluu.webtoon.ui.compose.theme.AppTheme
import com.pluu.webtoon.ui.compose.theme.md_theme_light_primary
import com.pluu.webtoon.utils.applyAgent

@Composable
Expand All @@ -50,12 +52,18 @@ internal fun EpisodeItemUi(
isRead: Boolean,
onClicked: (EpisodeInfo) -> Unit
) {
var isLoading by remember { mutableStateOf(true) }
var isError by remember { mutableStateOf(false) }
val painter = rememberAsyncImagePainter(
model = ImageRequest.Builder(LocalContext.current)
.data(item.image)
.applyAgent()
.crossfade(true)
.build()
.build(),
onState = { state ->
isLoading = state is AsyncImagePainter.State.Loading
isError = state is AsyncImagePainter.State.Error
}
)

Box(
Expand All @@ -65,38 +73,26 @@ internal fun EpisodeItemUi(
.height(100.dp)
.clickable { onClicked(item) }
) {
if (LocalInspectionMode.current) {
Box(
modifier = Modifier
.fillMaxSize()
.background(md_theme_light_primary)
)
} else {
if (isError.not() && !LocalInspectionMode.current) {
Image(
modifier = Modifier.fillMaxSize(),
painter = painter,
contentScale = ContentScale.Crop,
contentDescription = null,
)
}

when (painter.state) {
is AsyncImagePainter.State.Loading -> {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center),
color = colorResource(com.pluu.webtoon.ui_common.R.color.progress_accent_color)
)
}

is AsyncImagePainter.State.Error -> {
Image(
modifier = Modifier.align(Alignment.Center),
painter = painterResource(com.pluu.webtoon.ui_common.R.drawable.ic_sentiment_very_dissatisfied_48),
contentDescription = null
)
}

else -> {}
if (isLoading || LocalInspectionMode.current) {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center),
color = colorResource(com.pluu.webtoon.ui_common.R.color.progress_accent_color)
)
}
if (isError) {
Image(
modifier = Modifier.align(Alignment.Center),
painter = painterResource(com.pluu.webtoon.ui_common.R.drawable.ic_sentiment_very_dissatisfied_48),
contentDescription = null
)
}

EpisodeItemUiOverlayUi(item = item, isRead = isRead)
Expand Down Expand Up @@ -190,33 +186,11 @@ private fun PreviewEpisodeItemUi(
AppTheme {
EpisodeItemUi(
modifier = Modifier
.width(280.dp)
.width(200.dp)
.heightIn(min = 150.dp),
item = item,
isRead = values.second,
onClicked = {}
)
}
}

@Preview
@Composable
private fun PreviewEpisodeItemUiOverlayUi() {
val item = EpisodeInfo(
id = "0",
toonId = "0",
title = "Title",
image = "",
isLoginNeed = true
)
AppTheme {
EpisodeItemUiOverlayUi(
modifier = Modifier
.width(200.dp)
.background(md_theme_light_primary)
.wrapContentHeight(unbounded = true),
item = item,
isRead = true
)
}
}
66 changes: 25 additions & 41 deletions features/ui-weekly/src/main/java/com/pluu/webtoon/weekly/ui/day/WeeklyItemUi.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,10 @@ import androidx.compose.material3.Card
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
Expand All @@ -35,7 +39,6 @@ import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.Dimension
import androidx.core.graphics.toColorInt
import coil.compose.AsyncImagePainter
import coil.compose.rememberAsyncImagePainter
import coil.request.ImageRequest
Expand All @@ -44,7 +47,6 @@ import com.pluu.webtoon.model.Status
import com.pluu.webtoon.model.ToonInfo
import com.pluu.webtoon.model.ToonInfoWithFavorite
import com.pluu.webtoon.ui.compose.theme.AppTheme
import com.pluu.webtoon.ui.compose.theme.md_theme_light_primary
import com.pluu.webtoon.utils.applyAgent
import com.pluu.webtoon.weekly.R

Expand All @@ -55,12 +57,18 @@ internal fun WeeklyItemUi(
isFavorite: Boolean,
onClicked: (ToonInfo) -> Unit
) {
var isLoading by remember { mutableStateOf(true) }
var isError by remember { mutableStateOf(false) }
val painter = rememberAsyncImagePainter(
model = ImageRequest.Builder(LocalContext.current)
.data(item.image)
.applyAgent()
.crossfade(true)
.build()
.build(),
onState = { state ->
isLoading = state is AsyncImagePainter.State.Loading
isError = state is AsyncImagePainter.State.Error
}
)

Card(
Expand All @@ -70,51 +78,27 @@ internal fun WeeklyItemUi(
.height(100.dp)
.clickable { onClicked(item) }
) {
val backgroundModifier = when (painter.state) {
is AsyncImagePainter.State.Success -> {
if (item.backgroundColor.isNotEmpty()) {
Modifier.background(color = Color(item.backgroundColor.toColorInt()))
} else {
Modifier
}
}

else -> Modifier
}

Box(modifier = backgroundModifier) {
if (LocalInspectionMode.current) {
Box(
modifier = Modifier
.fillMaxSize()
.background(md_theme_light_primary)
)
} else {
Box {
if (isError.not() && !LocalInspectionMode.current) {
Image(
modifier = Modifier.fillMaxSize(),
painter = painter,
contentScale = ContentScale.Crop,
contentDescription = null,
)
}

when (painter.state) {
is AsyncImagePainter.State.Loading -> {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center),
color = colorResource(com.pluu.webtoon.ui_common.R.color.progress_accent_color)
)
}

is AsyncImagePainter.State.Error -> {
Image(
modifier = Modifier.align(Alignment.Center),
painter = painterResource(com.pluu.webtoon.ui_common.R.drawable.ic_sentiment_very_dissatisfied_48),
contentDescription = null
)
}

else -> {}
if (isLoading || LocalInspectionMode.current) {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center),
color = colorResource(com.pluu.webtoon.ui_common.R.color.progress_accent_color)
)
}
if (isError) {
Image(
modifier = Modifier.align(Alignment.Center),
painter = painterResource(com.pluu.webtoon.ui_common.R.drawable.ic_sentiment_very_dissatisfied_48),
contentDescription = null
)
}

WeeklyItemOverlayUi(
Expand Down

0 comments on commit ab4c07d

Please sign in to comment.