我希望直接使用在colors.xml中定义的自定义颜色,而不是使用Material主题颜色或Jetpack提供的默认主题颜色。有没有简单的方法可以做到这一点?
我希望直接使用在colors.xml中定义的自定义颜色,而不是使用Material主题颜色或Jetpack提供的默认主题颜色。有没有简单的方法可以做到这一点?
colorResource()
来加载颜色资源。Text(
text = "Hello World",
color = colorResource(R.color.purple_200)
)
在Color.kt文件中添加所需的颜色。
package com.<domain_name>.<app_name>.ui.theme
import androidx.compose.ui.graphics.Color
val Purple200 = Color(0xFFBB86FC)
val Purple500 = Color(0xFF6200EE)
val Purple700 = Color(0xFF3700B3)
val Teal200 = Color(0xFF03DAC5)
val Flower = Color(0xFF4CAF50)
val Deer = Color(0xFFFF5722)
val Mango = Color(0xFFFF9800)
val AppbarColor = Color(0xFF2196F3)
使用颜色的三种常见方法:
方法1:直接使用颜色
import com.<domain_name>.<app_name>.ui.theme.*
Text(text = "Hello ", color = Flower)
方法 2:覆盖默认的 MaterialTheme 颜色
现在在 Theme.kt 中。
private val DarkColorPalette = darkColors(
primary = Purple200,
primaryVariant = Purple700,
secondary = Teal200,
onBackground = Flower //Custom color
)
private val LightColorPalette = lightColors(
primary = Purple500,
primaryVariant = Purple700,
secondary = Teal200,
onBackground = Deer //Custom color
/* Other default colors to override
background = Color.White,
surface = Color.White,
onPrimary = Color.White,
onSecondary = Color.Black,
onBackground = Color.Black,
onSurface = Color.Black,
*/
)
@Composable
fun NotepadTheme(darkTheme: Boolean = isSystemInDarkTheme(),
content:@Composable() () -> Unit) {
val colors = if (darkTheme) {
DarkColorPalette
} else {
LightColorPalette
}
MaterialTheme(
colors = colors,
typography = Typography,
shapes = Shapes,
content = content
)
}
MainActivity.kt
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
ColorApp()
}
}
}
@Composable
fun ColorApp() {
ColorTheme {
Surface(modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colors.background) {
Greeting("Android")
}
}
}
@Composable
fun Greeting(name: String) {
Text(text = "Hello $name!", color = MaterialTheme.colors.onBackground) //Using color
}
@Preview(
showBackground = true, name = "Light mode",
uiMode = Configuration.UI_MODE_NIGHT_NO or
Configuration.UI_MODE_TYPE_NORMAL
)
@Preview(
showBackground = true, name = "Night mode",
uiMode = Configuration.UI_MODE_NIGHT_YES or
Configuration.UI_MODE_TYPE_NORMAL
)
@Composable
fun DefaultPreview() {
ColorApp()
}
方法三:自定义主题(推荐方法)
Text(text = "Hello ", color = AppNameTheme.colors.customColor)
import com.mypackagename.R
。 - Rumit Patel