dbaelz
07/23/2021, 9:36 AMModifier.border()
that overdraw each other (link and code in the thread). Gave an explanation why it's this way, but after I read it again I'm unsure if it's correct and I have second thoughts. Can someone shed some light into the topic?@ExperimentalFoundationApi
@Composable
private fun ModifierBorderPuzzler(borderWidth: Dp = 12.dp) {
Box(
modifier = Modifier
.size(200.dp)
.border(borderWidth, Color.Gray)
.border(borderWidth, Color.Cyan)
.padding(borderWidth)
.border(borderWidth, Color.Blue)
.border(borderWidth, Color.Magenta)
.padding(borderWidth)
.border(borderWidth, Color.Yellow)
.border(borderWidth, Color.Black)
.padding(borderWidth)
)
}
Results into a border (outer to inner): Gray > Blue > YellowAlbert Chang
07/23/2021, 10:03 AMdrawContent()
call in `ContentDrawScope`:
Modifier.drawWithCache {
onDrawWithContent {
// Draw behind
drawContent()
// Draw above
}
}
In the case of Modifier.border()
, the drawing code (e.g. here) is after drawContent()
so earlier borders are above later borders (the border drawn by the second modifier becomes the first modifier's content and so on).dbaelz
07/23/2021, 10:37 AMBorder
class and saw the drawContent()
method, but didn't get it that detailed from the documentation. Cool that you pointed that out!
Is it common for (framework) Composables to have this drawing order? It surely has it advantages, but might not be very intuitiv when it comes to modifier order (for this very special case).Albert Chang
07/23/2021, 10:44 AM