What ways there is to to get the proper textColor ...

# compose

[myanmarking]

What ways there is to to get the proper textColor given the background. I know contentColor works for Surface with color params. What are the other cases ?

[myanmarking]

Colunm(modifier = Modifier.background) won’t pick up the right text color

[myanmarking]

Being more clear, in order for the system to pick the right text color for example, do contentColor always needs to be provided with Surface. Why regular background modifier doesn’t work. And is that the only way (surface) ?

[Albert Chang]

You can provide default content color yourself:

Column(modifier = Modifier.background(bgColor)) {
    CompositionLocalProvider(LocalContentColor provides contentColorFor(bgColor)) {
        // Content
    }
}

[myanmarking]

hm ya, makes sense. Would you say wrapping into a surface is easier and the correct way ?

[Albert Chang]

It's easier but I don't think either is "wrong".

[myanmarking]

ok. thanks!

[OG]

There is an important distinction here actually on why you may or may not want to wrap in Surface to get content color set for you properly, or provide your own content color using the means described above.

If the background color set on Surface matches the value of MaterialTheme.color.surface (which I think is the default), and there is an elevation set, then the result background color will be lighter than what you expect. (This is intentional behavior of this component)

It may seem "edge-casy" thing to take into account when just wrapping everything in a Surface, but not really if you are trying to support dark and light theme fully.

Using the option described earlier in this thread may make more sense for you depending on your layout/use case, as you are probably trying to set a specific background color with the intention that the result is that specific color.