Android Compose change tap color

Question

I have a basic row in compose.

        Row(
            modifier = Modifier
                .fillMaxWidth()
                .background(MaterialTheme.colors.background)
                .clickable { click.invoke() }
        ) {
            Text(
                text = stringResource(id = item.first),
                textAlign = TextAlign.Start,
                color = MaterialTheme.colors.onPrimary,
                modifier = Modifier.padding(16.dp)
            )
        }

When its clicked the color is grey. I would like to change this to a custom color but I can't seem to figure out how.

user_3585796 · Answer

You can provide it with the indication parameter:

clickable(
    interactionSource = remember { MutableInteractionSource() },
    indication = rememberRipple(color = Color.Red),
) { }

If you want to change it for a group of views, you can provide it with CompositionLocalProvider in LocalIndication:

CompositionLocalProvider(
    LocalIndication provides rememberRipple(color = Color.Red)
) {
    SomeView()
)

Or you can embed it in your theme to apply to the whole application:

@Composable
fun AppTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {
    val colors = if (darkTheme) {
        DarkThemeColors
    } else {
        LightThemeColors
    }
    MaterialTheme(
        colors = colors,
        typography = typography,
        shapes = shapes,
    ) {
        CompositionLocalProvider(
            LocalIndication provides rememberRipple(color = Color.Red),
            content = content,
        ) 
    }
}

Android Compose change tap color

1 Answers