如何在 Jetpack Compose 中引用主题属性？

Question

所以在目前的andriod开发中，如果我们需要在主题中引用一个颜色集，我们可以简单地这样做：（在布局xml中）

....
    <TextView
        ...
        android:textColor="?attr/colorPrimary"
        .../>
....

如果我在主题中设置蓝色。我会在上面的 textview 中得到那个颜色。

我想知道如何在Jetpack Compose 中做同样的事情。在Compose，我们这样做了，

MaterialTheme(...) {
    Column {
        Text(
            ...
            textStyle = TextStyle(color = ????) // How to I reference to the theme?
        )
    }
}

Answer 1

你可以使用类似的东西：

Text(text = "....",
     style = TextStyle(color = MaterialTheme.colors.primary))

Answer 2

Compose 提供基于 Material 颜色规范的ColorPalette 来生成您的应用主题。它提供lightColorPalette和darkColorPalette分别用于定义明暗模式的主题。

val lightThemeColors = lightColorPalette(
    primary = Color(0xFFFFFFFF),
    primaryVariant = Color(0xFFFFFFFF),
    onPrimary = Color.Black,
    secondary = Color.Transparent,
    onSecondary = Color.White,
    background = Color.White,
    onBackground = Color(0xFF212121),
    surface = Color.White,
    onSurface = Color(0xFF212121),
    error = Color.Red,
    onError = Color.White
)
val darkThemeColors = darkColorPalette(
    primary = Color(0xFF000000),
    primaryVariant = Color(0xFF000000),
    onPrimary = Color.White,
    secondary = Color.White,
    onSecondary = Color.White,
    surface = Color(0xFF212121),
    background = Color(0xFF212121),
    onBackground = Color.White,
    onSurface = Color.White,
    error = Color.Red,
    onError = Color.White
)
MaterialTheme(
colors = if(isSystemInDarkTheme()) darkThemeColors else lightThemeColors
) {
    Column {
        Text(
        textStyle = TextStyle(color = MaterialTheme.colors.primary)
        )
    }
}

如果您想为您的主题添加更多自定义颜色，您可以使用带有扩展变量的ColorPalette，如下所示

@Composable
val ColorPalette.myColor: Color
    get() = if(!isLight) Color(0xFF424242) else Color.White

现在您可以使用MaterialTheme.colors.myColor 来包含。

如果你想包含来自 android 颜色 xml 的颜色，你可以使用 colorResource(id = R.color.anyName) 函数来实现。