drawBehind , drawWithContent , drawWithCache Modifier In Jetpack Compose

Photo by Markus Spiske on Unsplash

In this article we will see drawBehind , drawWithContent and drawWithCache modifier in Jetpack Compose.

drawBehind Modifier

drawBehind modifier is very useful . Use it when you want to draw something behind any composable function .

Let’s make this with drawBehind modifier

Basically we have a Text and behind this we added a rounded rectangle.

@Composable
fun DrawBehindSomething(
    modifier: Modifier
) {

    Box(modifier = modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
        Text(text = stringResource(R.string.hello_world),
            modifier = Modifier
                .drawBehind {
                    drawRoundRect(
                        color = Color.Black,
                        cornerRadius = CornerRadius(16.dp.toPx(), 16.dp.toPx())
                    )
                }
                .padding(horizontal = 30.dp, vertical = 10.dp),
            color = Color.White
        )
    }

}

As you can see the above code , we have used drawBehind modifier on Text . drawBehind takes extension…