Why don't Indication work for Button or Icons?

Question

As solved here, I disable the tap flashing by setting the indication to null.

However, this is not working for Button or Icons?!

Chaney

Answer 1

In the Button you can't use the indication=null in the clickable modifier since it is defined internally by the component which uses indication = rememberRipple(). This creates and remembers a Ripple using values provided by RippleTheme.

You can provide a custom LocalRippleTheme to override the default behaviour.

Something like:

CompositionLocalProvider(LocalRippleTheme provides NoRippleTheme) {
    Button(
        onClick = { /*...*/ },
    ) {
       //...
    }
}

with:

private object NoRippleTheme : RippleTheme {
    @Composable
    override fun defaultColor() = Color.Unspecified

    @Composable
    override fun rippleAlpha(): RippleAlpha = RippleAlpha(0.0f,0.0f,0.0f,0.0f)
}

Apologia

The solution isn't working for me. When the Button goes to onPressed state the ripple still appears over it. It's quite annoying because I would like to use the Material button but I will manage the colors manually for the background and for the content of the button. I'm relying on InteractionSource.collectIsPressedAsState() to listen for the onPressed state and adjust the colors of the button accordingly. But because of the default ripple that the button has there is an overlay over the button that breaks the inteded design. Returning defaultColor() = Color.Transparent doesn't solve. – Thither

It seems that Compose is ignoring the Alpha at the color. override fun defaultColor() = Color(0xFF000000) and override fun defaultColor() = Color(0x00000000) come with the exact same result! – Thither

Answer 2

You can use

Modifier.pointerInput(Unit) {
    detectTapGestures(
        onPress = { /* Called when the gesture starts */ },
        onDoubleTap = { /* Called on Double Tap */ },
        onLongPress = { /* Called on Long Press */ },
        onTap = { /* Called on Tap */ }
    )
}

instead of onClick().It' will not show the wave effect when click the button.

Alsacelorraine