Jetpack Compose中MaterialTheme.colors与colorScheme的区别及正确用法

核心区别 #

两者分属Jetpack Compose中两个不同的Material设计系统：

• MaterialTheme.colors：属于Material 2设计体系，对应包androidx.compose.material，是早期Compose版本的色彩API，基于旧版Material色彩规范，仅提供primary、secondary、background等基础色彩变量。
• MaterialTheme.colorScheme：属于Material 3设计体系，对应包androidx.compose.material3，是谷歌新一代色彩API，适配Android 12+动态色彩功能，提供tertiary、surfaceVariant、onSurfaceVariant等更细分的色彩层级，贴合现代UI设计需求。

优劣对比 #

MaterialTheme.colors #

• 优势：适配存量Material 2项目，API稳定，相关文档、示例资源丰富。
• 劣势：不支持动态色彩，色彩变量维度单一，属于官方标记的旧API，后续更新支持会逐步减少。

MaterialTheme.colorScheme #

• 优势：支持Material 3所有新特性（动态色彩、更细腻的色彩语义），是官方推荐的新一代API，能实现更具个性化和现代感的UI。
• 劣势：与Material 2组件不兼容，若项目未完全迁移到Material 3，混用会出现类型不匹配的报错（也就是你遇到的报红问题）。

正确用法 #

1. 统一技术栈：
   • 新项目直接采用Material 3：导入androidx.compose.material3包，使用Material3Theme作为主题根节点，所有组件（如Surface、ElevatedButton）和色彩引用都用colorScheme。
   • 旧项目维护Material 2：继续使用androidx.compose.material包的MaterialTheme，色彩引用保持用colors，不要随意切换到colorScheme。
2. 避免跨版本混用：
   Material 3组件无法识别Material 2的colors类型，反之亦然，这就是混用其中一个会报红的原因。比如你示例中用的是Material 3的Surface和ElevatedButton，搭配colorScheme.primary是正确的，若换成colors.primary就会因类型不匹配报错。

你的示例代码是标准的Material 3用法，完全正确：

Surface(
    color = MaterialTheme.colorScheme.primary,
    modifier = Modifier.padding(vertical = 4.dp, horizontal = 8.dp)
) {
    Row(modifier = Modifier.padding(24.dp)) {
        Column(modifier = Modifier
            .weight(1f)
            .padding(bottom = extraPadding)
        ) {
            Text(text = "Hello, ")
            Text(text = name)
        }
        ElevatedButton(
            onClick = { expanded.value = !expanded.value }
        ) {
            Text(if (expanded.value) "Show less" else "Show more")
        }
    }
}

内容的提问来源于stack exchange，提问作者c-an