I'm making a theme for my app with jetpack compose and I have this:
@Composable
fun MyTheme(content: @Composable () -> Unit) {
val colors = lightColors(
primary = CustomColors.Custom1,
primaryVariant = CustomColors.Custom2,
onPrimary = Color.White,
background = Color.White,
secondary = CustomColors.Custom2
)
MaterialTheme(colors = colors, content = content)
}
object CustomColors{
val Custom1 = Color(0xEF119335)
val Custom2= Color(0xAA892335)
}
The problem is that when I add secondary = CustomColors.Custom2, I get an error in onPrimary = Color.White. The error is this:
Conflicting 'on' color for a given background error
Error description from Compose source code
Background colors with the same value should have the same 'on' color
In the Material color system background colors have a corresponding 'on' color which is used for the content color inside a component. For example, a button colored
primarywill haveonPrimarytext. Because of this, it is important that there is only one possibleonColorfor a given color value, otherwise there is no way to know which 'on' color should be used inside a component. To fix this either use the same 'on' color for identical background colors, or use a different background color for each 'on' color.
In your case, you have both primaryVariant and secondary set to CustomColors.Custom2, this means corresponding background colors should be the same too.
Default onSecondary color is Color.Black, and for onPrimary you've specified Color.White, that's why the compiler in unhappy.
You can solve this problem by specifying onSecondary = Color.White or by choosing different colors for primaryVariant and secondary.
If after this explanation you still wanna use these exact colors, you can silent this warning with @SuppressLint("ConflictingOnColor"): but some system or Material elements may not look good.