Jetpack compose Box layout clip showing white background

Question

Compose Box layout showing white background when applying Clip Option

Box( modifier = Modifier        
    .size(50.dp)
    .clip(CircleShape)
    .background(colorResource(id = R.color.black_trans))
)

Is there any way to transparent the background when CircleClip is applied?

Answer 1

Box( modifier = Modifier        
    .size(50.dp)
    .background(colorResource(id = R.color.black_trans))
    .clip(CircleShape)
)

https://developer.android.com/jetpack/compose/modifiers

Answer 2

In Jetpack Compose the order of the modifiers matters. So add background color first and then clip.

Box( modifier = Modifier        
.size(50.dp)
.background(colorResource(id = R.color.black_trans))
.clip(CircleShape)
)

Modifier Reference: https://developer.android.com/jetpack/compose/modifiers#order-modifier-matters

Answer 3

Box(
                modifier = Modifier
                    .size(100.dp)
                    .clip(RoundedCornerShape(25))
                    .background(Color.Blue)

In Modifier order metters so we have to add background at last.