Rounded corner only at top of image AysncImage Coil

Question

I'm using the new AysncImage loader for compose inside a Box. The Box itself has a RoundedCornerShape. I have also added a RoundedCornerShape for the AsyncImage with the following values

Box(
    modifier = modifier.clip(RoundedCornerShape(16.dp))
) {
    AsyncImage(
        modifier = Modifier
            .height(146.dp)
            .clip(shape = RoundedCornerShape(
                topStart = 16.dp,
                topEnd = 16.dp,
                bottomStart = 0.dp,
                bottomEnd = 0.dp)
            ),
        model = R.drawable.image,
        contentDescription = null,
        contentScale = ContentScale.Crop
    )
}

But the image is rounded at all corners. Screen Shot here

I don't want the image to have rounded corners at bottom.

Answer 1

Add this modifier to your AsyncImage

 modifier = Modifier.clip(RoundedCornerShape(topEnd = 8.dp , topStart = 8.dp))