MaterialTheme配色显示异常：预览与代码定义颜色不符求助

你遇到的问题是代码里定义的Primary颜色（#A43D00）和Layout Inspector显示的（#00658D）不一致，大概率是以下几个原因导致的，按顺序排查：

1. 检查Theme可组合项是否正确关联自定义ColorScheme #

打开ui/theme/Theme.kt，找到你的主题可组合函数（比如叫MyAppTheme），确认它在选择颜色方案时，是否用了你替换的LightColorScheme和DarkColorScheme，同时注意动态颜色开关的影响：

@Composable
fun MyAppTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    dynamicColor: Boolean = true, // 这里如果是true，Android 12+会优先用系统动态颜色
    content: @Composable () -> Unit
) {
    val colorScheme = when {
        // 动态颜色会覆盖你自定义的配色，需要把dynamicColor设为false
        dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
            val context = LocalContext.current
            if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
        }
        darkTheme -> DarkColorScheme // 确认这里是你定义的DarkColorScheme
        else -> LightColorScheme // 确认这里是你定义的LightColorScheme
    }

    MaterialTheme(
        colorScheme = colorScheme,
        typography = Typography,
        content = content
    )
}

如果开了dynamicColor=true，Android 12及以上设备会自动生成动态颜色，完全覆盖你自定义的配色，直接把dynamicColor改成false试试。

2. 清理缓存+重新构建项目 #

Android Studio的缓存经常会搞鬼，修改代码后不生效是常事：

• 点击顶部菜单栏：Build → Clean Project
• 然后点击：Build → Rebuild Project
• 如果还是不行，直接File → Invalidate Caches... → 勾选Invalidate and Restart，重启AS后再构建。

3. 检查Composable是否正确包裹在自定义Theme里 #

不管是预览还是实际运行的代码，所有需要用自定义主题的Composable都必须包裹在你的MyAppTheme（或对应主题函数）里面：

// 预览示例
@Preview(showBackground = true)
@Composable
fun MyScreenPreview() {
    MyAppTheme { // 必须加这一行
        MyScreenContent()
    }
}

// Activity里的示例
class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MyAppTheme { // 必须加这一行
                // 你的页面内容
            }
        }
    }
}

如果某个Composable没包裹在自定义Theme里，会用默认的Material主题，颜色自然不对。

4. 检查颜色变量引用是否正确 #

• 确认Theme.kt里的LightColorScheme/DarkColorScheme引用的是md_theme_light_primary这类你替换的变量，有没有拼写错误（比如少了下划线、字母写错）。
• 检查Color.kt里有没有残留的旧颜色变量（比如原来的val Primary = Color(...)），如果你的Composable还在引用旧变量，也会显示错误颜色。

5. 排查Layout Inspector里的颜色来源 #

在Layout Inspector里选中显示错误颜色的组件，查看它的颜色属性来源：

• 如果显示的是android:colorPrimary这类系统属性，说明你的Composable没正确使用Compose的MaterialTheme.colorScheme.primary，而是直接用了系统主题的颜色。
• 如果是硬编码的颜色，那要检查对应Composable的代码，把硬编码改成引用MaterialTheme.colorScheme里的变量。

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