How to detect that a button is pressed in Jetpack Compose?-CodePudding

I try to get a button that has this cool effect of the border radius changing when tapped (like in the Android 12 default calculator application) while also keeping the button's ripple effect.

What I thought would work was this:

var pressed by remember { mutableStateOf(false) }
val borderRadius by animateDpAsState(
    if (pressed) 10.0.dp
    else 20.0.dp
)
val buttonTitle = "uniqueButton"

Button(
    onClick = {
        // some on click stuff
    },
    shape = RoundedCornerShape(borderRadius),
    modifier = Modifier
        .pointerInput(buttonTitle) {
            detectTapGestures(
                onPress = {
                    pressed = true
                    tryAwaitRelease()
                    pressed = false
                }
            )
        }
) {
    Text(text = buttonTitle)
}

But the code within the function passed for onPress is never executed. From my understandig it should be, when the button is tapped or pressed. Where is my mistake, do I misunderstand something in the documentation?

CodePudding user response：

Most of Compose controls have interactionSource parameter for this purpose. Here's how you can use it:

val interactionSource = remember { MutableInteractionSource() }
val pressed by interactionSource.collectIsPressedAsState()
Button(
    onClick = {},
    interactionSource = interactionSource,
) {

}