Jetpack Compose中给定背景颜色的'on'颜色冲突错误。

Question

我正在使用Jetpack Compose为我的应用设计主题，我有以下代码：

@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)

}

问题在于当我添加secondary = CustomColors.Custom2时，在onPrimary = Color.White中会出现错误。错误信息如下：

给定背景的'on'颜色冲突错误

- RaceyT

Answer 1

来自Compose的错误描述源代码

具有相同值的背景颜色应该具有相同的“on”颜色

在Material颜色系统中，背景颜色具有相应的“on”颜色，用于组件内部的内容颜色。例如，一个带有primary颜色的按钮将具有onPrimary文本。因此，重要的是对于给定的颜色值只有一个可能的onColor，否则就无法知道组件内应使用哪个' on '颜色。要解决这个问题，请使用相同的“on”颜色来处理相同的背景颜色，或者针对每个“on”颜色使用不同的背景颜色。

在您的情况下，您将primaryVariant和secondary都设置为CustomColors.Custom2，这意味着相应的背景颜色也应该相同。

默认的onSecondary颜色为Color.Black，而对于onPrimary，您已指定为Color.White，这就是编译器不满意的原因。

您可以通过指定onSecondary = Color.White或选择不同的颜色来解决此问题，用于primaryVariant和secondary。

如果你仍想使用这些确切的颜色，在本次解释后，你可以通过 @SuppressLint("ConflictingOnColor") 来静默此警告：但是一些系统或材料元素可能看起来不好。

- Phil Dukhov