Hello everyone! When recomposing is triggered on a...

# compose

[immathan]

Hello everyone! When recomposing is triggered on a click of a Card , the backgroundColor property is getting changed based on the condition, but not the border.

fun CardDisplay() {
    val selected = remember { mutableStateOf(true) }
    Surface(modifier = Modifier.fillMaxSize().gravity(Alignment.CenterVertically)) {
        Card(
            modifier = Modifier
                .size(32.dp).clickable(onClick = {
                    selected.value = !selected.value
                }),
            backgroundColor = if (selected.value) Color.Red else Color.Black,
            border = if (selected.value) BorderStroke(2.dp, Color.Green) else null,
        ) {

        }
    }
}

If you notice the cardbug.mp4 video, the border property is not reflected since the green color border is not going off.

But I tried changing the border width to 0.dp and it’s working as expected. Is this the expected behaviour?

border = if (selected.value) BorderStroke(2.dp, Color.Green) else BorderStroke(0.dp, Color.Green),

cardbug2.mp4cardbug.mp4

[venomvendor]

border = if (selected.value) BorderStroke(2.dp, Color.Green) else null

[venomvendor]

Your else condition is null

[immathan]

That’s not working. The Card is caching the previous border state while recomposing. Only if I give else block a instance of BorderStroker with a 0.dp then only the border is being reset.

border = if (selected.value) BorderStroke(2.dp, Color.Green) else BorderStroke(0.dp, Color.Green),