AsyncImage(
model = topics[index].coverPhoto.urls.regularUrl,
contentDescription = null,
contentScale = ContentScale.Crop,
modifier = Modifier.wrapContentWidth()
.height(120.dp)
.padding(vertical = 8.dp)
.clip(RoundedCornerShape(16.dp))
.drawWithCache {
val gradient = Brush.verticalGradient(
colors = listOf(Color.Transparent, Color.Black),
startY = size.height / 3,
endY = size.height
)
onDrawWithContent {
drawContent()
drawRect(gradient, blendMode = BlendMode.Multiply)
}
}
)
You can try an image composable like this.
I think you should create the gradient in a composy way
Column(Modifier.fillMaxSize()
.background(Color.White)) {
Box(
modifier = Modifier
.fillMaxWidth()
.background(color = Color.White)
.height(200.dp)
) {
Image(
painter = painterResource(
id = R.drawable.ty
),
contentDescription = null,
modifier = Modifier
.fillMaxWidth(),
contentScale = ContentScale.Crop
)
Box(
modifier = Modifier
.background(
brush = Brush.verticalGradient(
colors = listOf(
MaterialTheme.colors.primary.copy(alpha = 0.5f),
MaterialTheme.colors.primaryVariant.copy(alpha = 0.5f)
)
)
)
.fillMaxSize()
)
}
}
}
