Android Studio中Dynamic Color Preview功能失效求助

核心问题 #

你的ClockTheme依赖Build.VERSION.SDK_INT >= Build.VERSION_CODES.S判断是否启用动态配色，但Android Studio的预览环境中，该系统版本逻辑不会触发动态配色，导致预览始终使用静态颜色方案。

解决方案 #

1. 修改主题函数，添加动态颜色控制参数

在Theme.kt中给ClockTheme增加可配置的dynamicColor参数，允许预览时强制启用动态配色：

@Composable
fun ClockTheme(
    useDarkTheme: Boolean = isSystemInDarkTheme(),
    // 添加参数，默认依赖系统版本，预览时可手动开启
    dynamicColor: Boolean = Build.VERSION.SDK_INT >= Build.VERSION_CODES.S,
    content: @Composable () -> Unit
) {
    val colorScheme = when {
        // 使用传入的dynamicColor参数判断，而非仅依赖系统版本
        dynamicColor -> {
            val context = LocalContext.current
            if (useDarkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
        }
        else -> if (useDarkTheme) DarkColorScheme else LightColorScheme
    }

    val defaultBackgroundTheme = BackgroundTheme(
        color = colorScheme.surface,
        tonalElevation = 2.dp,
    )

    val backgroundTheme = when {
        dynamicColor -> defaultBackgroundTheme
        else -> if (useDarkTheme) DarkBackgroundTheme else  LightBackgroundTheme
    }

    val tintTheme = when {
        dynamicColor -> TintTheme(colorScheme.primary)
        else -> TintTheme()
    }

    val view = LocalView.current
    if (!view.isInEditMode) {
        SideEffect {
            val window = (view.context as Activity).window
            window.statusBarColor = colorScheme.background.toArgb()
            WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = !useDarkTheme
        }
    }

    CompositionLocalProvider(
        LocalBackgroundTheme provides backgroundTheme,
        LocalTintTheme provides tintTheme,
    ){
        MaterialTheme(
            colorScheme = colorScheme,
            typography = Typography,
            content = content
        )
    }
}

2. 更新预览代码，强制开启动态配色

在预览函数中显式传递dynamicColor = true，确保预览环境使用动态颜色方案：

@Preview(wallpaper = Wallpapers.RED_DOMINATED_EXAMPLE)
@Composable
private fun TestPreview() {
    ClockTheme(dynamicColor = true) {
        Surface(
            modifier = Modifier.wrapContentSize(),
            color = MaterialTheme.colorScheme.background
        ) {
            Text(
                text = "Hello World!",
                color = MaterialTheme.colorScheme.primary,
                style = MaterialTheme.typography.displayLarge,
                modifier = Modifier
            )
        }
    }
}

额外排查点 #

• 确保Android Studio版本为**2023.1.1 (Electric Eel)**及以上，旧版本对Material 3动态颜色预览支持不完善
• 若缺失可补充ui-tooling依赖：implementation("androidx.compose.ui:ui-tooling")
• 清理项目缓存：点击File -> Invalidate Caches... -> Invalidate and Restart，排除缓存导致的预览异常

内容的提问来源于stack exchange，提问作者SONU