moko-resources icon indicating copy to clipboard operation
moko-resources copied to clipboard

Color references don't work when using dark/light attributes

Open rylexr opened this issue 2 years ago • 3 comments

When using light/dark attributes pointing to another themed color, moko resources is unable to generate the platform files properly. Take this example:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="themeColor1">
        <light>0xB92743FF</light>
        <dark>7CCFEEFF</dark>
    </color>
    <color name="themeColor2">
        <light>@color/themeColor1</light>
        <dark>@color/themeColor1</dark>
    </color>
</resources>

I'd expect referencing @color/themeColor1 from themeColor2 to resolve to light and dark values accordingly and to use themeColor2.light value in Android values/colors.xml and themeColor2.dark value in values-night/colors.xml. Could we please add support for this?

Also, is there a workaround?

rylexr avatar Apr 06 '23 20:04 rylexr

I have the same problem. @Alex009

softcleandev avatar Apr 14 '23 08:04 softcleandev

I use the dark and light colors for darkColors() and lightColors() functions, so I can use them in MaterialTheme.

private val DarkColorPalette = darkColors(
    primary = Color(MR.colors.primary.dark.colorInt()),
    primaryVariant = Color(MR.colors.primaryVariant.dark.colorInt()),
    onPrimary = Color(MR.colors.onPrimary.dark.colorInt()),

    secondary = Color(MR.colors.primary.dark.colorInt()),
    onSecondary = Color(MR.colors.onPrimary.dark.colorInt()),

    error = Color(MR.colors.error.dark.colorInt()),
    onError = Color(MR.colors.onError.dark.colorInt()),
)

private val LightColorPalette = lightColors(
    primary = Color(MR.colors.primary.light.colorInt()),
    primaryVariant = Color(MR.colors.primaryVariant.light.colorInt()),
    onPrimary = Color(MR.colors.onPrimary.light.colorInt()),

    secondary = Color(MR.colors.primary.light.colorInt()),
    onSecondary = Color(MR.colors.onPrimary.light.colorInt()),

    error = Color(MR.colors.error.light.colorInt()),
    onError = Color(MR.colors.onError.light.colorInt()),
)
val colors = remember {
        mutableStateOf(
            if (darkTheme.value) {
                DarkColorPalette
            } else {
                LightColorPalette
            }
        )
    }

    ...
        MaterialTheme(
            colors = colors.value,
            content = content,
        )

Could it be that my approach to using the dark/light colors is completely wrong?

softcleandev avatar Apr 17 '23 11:04 softcleandev

Any news on this one @Alex009 ?

rylexr avatar Jun 04 '23 14:06 rylexr