Search code examples
textviewandroid-jetpack-composecomposable

ClickableText Composable font color not adjusting to dark mode


I implemented a ClickableText composable following the explanations in the documentation. However, while all regular Text composables within my app properly change their color to black when Android is in light mode and to white when the system is in dark mode, this does not happen with the ClickableText. The text always stays black, even in dark mode.

After looking into the Text composable code, I found that by default, LocalTextStyle.current is applied as a style per default.
So I tried to set the ClickableText style attribute to LocalTextStyle.current, but still, it did not change anything:

// This Composable properly adjusts to the system dark mode
Text(
    modifier = Modifier.padding(bottom = 16.dp),
    text = "Hello"
)

// But this Composable does not adjust
ClickableText(
    text = annotatedText,
    style = LocalTextStyle.current,   // What do I need to change here?
    onClick = { offset ->
        // ...   
              }
)

Which style do I need to apply so that the ClickableText color adjusts to the current theme, too?
Thanks to anyone trying to help out.


Solution

  • You can use:

        val color = LocalContentColor.current.copy(alpha = LocalContentAlpha.current)
    
        ClickableText(
            text = buildAnnotatedString { append("Hello") },
            style = TextStyle.Default.copy(color = color),
            onClick = {
                // ...
            }
        )
    

    enter image description here