英文:
Material3 theme in jetpack compose gives different color
问题
我只在代码部分提供翻译,如下:
我刚刚在Jetpack Compose中使用Material 3创建了一个新项目。我在项目中没有进行任何更改。
只是在Theme.kt文件中,我添加了背景色:
private val DarkColorScheme = darkColorScheme(
primary = Color.Red,
secondary = Color.White,
background = Color(0xFF5CB15A)
)
private val LightColorScheme = lightColorScheme(
primary = Color.Red,
secondary = Color.Black,
background = Color(0xFF5CB15A)
)
现在当我在我的组合文件中使用它时:
TextButton(modifier = Modifier
.background(
color = MaterialTheme.colorScheme.background,
shape = RoundedCornerShape(10.dp)
).....
我得到完全不同的颜色。为什么会这样?
MainActivity.kt文件内容:
MainActivity.kt
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
WindowCompat.setDecorFitsSystemWindows(window, false)
setContent {
val navController = rememberNavController()
PetCareComposeTheme {
GetStarted()
}
}
}
}
英文:
I just created a new project in jetpack compose with material 3. I did not change anything in the project.
Just in Theme.kt file i added background
private val DarkColorScheme = darkColorScheme(
primary = Color.Red,
secondary = Color.White,
background = Color(0xFF5CB15A)
)
private val LightColorScheme = lightColorScheme(
primary = Color.Red,
secondary = Color.Black,
background = Color(0xFF5CB15A)
)
Now when i use it in my composable file
TextButton(modifier = Modifier
.background(
color = MaterialTheme.colorScheme.background,
shape = RoundedCornerShape(10.dp)
).....
I get completely different color. Why is that?
MainActivity.kt
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
WindowCompat.setDecorFitsSystemWindows(window, false)
setContent {
val navController = rememberNavController()
PetCareComposeTheme {
GetStarted()
}
}
}
}
答案1
得分: 3
在Material 3中,默认启用了动态颜色。尝试禁用它。
@Composable
fun PetCareTheme(
darkTheme: Boolean = isSystemInDarkTheme(),
// 动态颜色在Android 12+上可用
dynamicColor: Boolean = false, // 将其更改为false以默认禁用
content: @Composable () -> Unit
) {
val colorScheme = when {
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
val context = LocalContext.current
if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
}
darkTheme -> DarkColorScheme
else -> LightColorScheme
}
val view = LocalView.current
if (!view.isInEditMode) {
SideEffect {
val window = (view.context as Activity).window
window.statusBarColor = colorScheme.primary.toArgb()
WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme
}
}
MaterialTheme(
colorScheme = colorScheme,
typography = Typography,
content = content
)
}
动态颜色概述:https://m3.material.io/styles/color/dynamic-color/overview
英文:
In Material 3, dynamic color is enabled by default. Try disabling it.
@Composable
fun PetCareTheme(
darkTheme: Boolean = isSystemInDarkTheme(),
// Dynamic color is available on Android 12+
dynamicColor: Boolean = false, // change to false to disable by default
content: @Composable () -> Unit
) {
val colorScheme = when {
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
val context = LocalContext.current
if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
}
darkTheme -> DarkColorScheme
else -> LightColorScheme
}
val view = LocalView.current
if (!view.isInEditMode) {
SideEffect {
val window = (view.context as Activity).window
window.statusBarColor = colorScheme.primary.toArgb()
WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme
}
}
MaterialTheme(
colorScheme = colorScheme,
typography = Typography,
content = content
)
}
Dynamic color overview : https://m3.material.io/styles/color/dynamic-color/overview
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论