Android 撰寫自定義主題 colors - 文本顏色不選擇主題顏色

Question

我似乎無法理解為什么 Android Compose Text（撰寫 1.0.0-beta01 和 beta02）沒有選擇我的主題顏色

setContent {
    MyTheme {
        Text(
            "hello world!",
//                    color = androidx.compose.ui.graphics.Color.Red, // this works
            color = MyTheme.colors.colorPrimary, // this doesn't work
            style = MyTheme.typography.label, // this works
        )
    }
}

我的主題是從這里復制的https://github.com/android/compose-samples/blob/92f2f16e4e63fa0e4418f660dde9e9558674cee5/Jetsnack/app/src/main/java/com/example/jetsnack/ui/theme/Theme.kt

這是代碼

private val LightColorPalette = MyColors(
    colorPrimary = DodgerBlue,
    colorOnPrimary = White,
//...
    isDark = false
)

private val DarkColorPalette = MyColors(
    colorPrimary = DodgerBlue,
    colorOnPrimary = White,
//...

    isDark = true
)


@Composable
fun MyTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {
    val customColours = if (darkTheme) DarkColorPalette else LightColorPalette
    val typography = MyTypography(
        h1 = TextStyle(
            fontFamily = circularXxFontFamily,
            fontWeight = FontWeight.W300,
            fontSize = 24.sp,
            color = customColours.colorOnSurface,
            lineHeight = 30.sp,
        ),
        //...
        label = TextStyle(
            fontFamily = xxxxFontFamily,
            fontWeight = FontWeight.W300,
            fontSize = 12.sp,
            color = customColours.colorOnSurface,
            lineHeight = 15.sp,
        )
    )

    ProvideMyTheme(customColours, typography) {
        MaterialTheme(
            colors = mapBasicColors(customColours, darkTheme),
            typography = Typography(),
            shapes = Shapes(),
            content = content
        )
    }
}


object MyTheme {
    val colors: MyColors
        @Composable
        get() = LocalMyColors.current

    val typography: MyTypography
        @Composable
        get() = LocalMyStyle.current
}

@Stable
class MyColors( 
    colorPrimary: Color,
    colorOnPrimary: Color,
//...

    isDark: Boolean
) {

    var colorPrimary by mutableStateOf(colorPrimary)
        private set
    var colorOnPrimary by mutableStateOf(colorOnPrimary)
        private set
//...
    var isDark by mutableStateOf(isDark)
        private set

    fun update(other: MyColors) {
        colorPrimary = other.colorPrimary
        colorOnPrimary = other.colorOnPrimary
        //...
        isDark = other.isDark
    }
}

@Composable
fun ProvideMyTheme(
    colors: MyColors,
    typography: MyTypography,
    content: @Composable () -> Unit
) {
    val colorPalette = remember { colors }
    colorPalette.update(colors)
    val myTypography = remember { typography }
    CompositionLocalProvider(
        LocalMyColors provides colorPalette,
        LocalMyStyle provides myTypography,
        content = content)
}

private val LocalMyColors = staticCompositionLocalOf<MyColors> {
    error("No ColorPalette provided")
}

private val LocalMyStyle = staticCompositionLocalOf<MyTypography> {
    error("No Typography provided")
}


fun mapBasicColors(
    colors: MyColors,
    darkTheme: Boolean,
) = Colors(
    primary = colors.colorPrimary,
    primaryVariant = colors.colorPrimaryVariant,
    secondary = colors.colorSecondary,
    secondaryVariant = colors.colorSecondaryVariant,
    background = colors.colorBackground,
    surface = colors.colorSurface,
    error = colors.colorError,
    onPrimary = colors.colorOnPrimary,
    onSecondary = colors.colorOnSecondary,
    onBackground = colors.colorOnBackground,
    onSurface = colors.colorOnSurface,
    onError = colors.colorOnError,
    isLight = !darkTheme
)


@Stable
class MyTypography(
    h1: TextStyle,
    label: TextStyle,
    //...
) {
    var h1 by mutableStateOf(h1)
        private set
    var label by mutableStateOf(label)
        private set
    //...
}

布局檢查員清楚地說文本是藍色的，那為什么不畫成藍色呢？

Answer 1

@Composable
fun messageCard(name:String){
    Text(text = "Bismillah $name", color = colorResource(id = R.color.purple_200))
}

使用資源文件中的 colors

Answer 2

好吧，這確實是一個非常愚蠢的錯誤

我的顏色定義不好

val DodgerBlue = Color(0x4681F7)

而不是（注意 alpha 部分）

val DodgerBlue = Color(0xff4681F7)

有趣的部分是布局編輯器能夠顯示正確的顏色......對我來說就像一個錯誤！