Add Spacer for loading image state

This commit is contained in:
LooKeR 2022-02-25 11:57:28 +05:30
parent 000bd16256
commit 4a58459f5c

View File

@ -2,14 +2,19 @@ package com.looker.droidify.ui.compose.components
import android.net.Uri
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.shape.CornerBasedShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import coil.annotation.ExperimentalCoilApi
import coil.compose.ImagePainter
import coil.compose.rememberImagePainter
import com.looker.droidify.R
import com.looker.droidify.ui.compose.theme.LocalShapes
@ -20,6 +25,7 @@ fun NetworkImage(
modifier: Modifier = Modifier,
data: Uri?,
contentScale: ContentScale = ContentScale.Crop,
backgroundColor: Color = MaterialTheme.colorScheme.surface,
shape: CornerBasedShape = RoundedCornerShape(LocalShapes.current.medium)
) {
Box(modifier) {
@ -36,5 +42,13 @@ fun NetworkImage(
.matchParentSize()
.clip(shape)
)
if (painter.state is ImagePainter.State.Loading) {
Spacer(
modifier = Modifier
.matchParentSize()
.background(backgroundColor)
)
}
}
}