在Compose Material3中如何实现适配明暗主题的自定义颜色？

在传统View开发中，我们可以通过attrs.xml定义自定义属性，结合styles.xml的明暗主题配置，实现颜色自动适配明暗模式。而在Compose Material3中，由于ColorScheme没有isLight属性，很多开发者不知道如何实现类似的简洁方案，这里提供几种实用的实现方式：

方法一：利用Android资源系统自动适配（最接近传统方式） #

这种方式和传统View开发逻辑完全一致，通过资源目录区分明暗模式，无需手动判断主题：

1. 定义明暗模式下的颜色资源
   在res/values/colors.xml（亮色模式）中添加：

<color name="my_custom_color">#FFFFFF</color>

在res/values-night/colors.xml（暗色模式）中添加：

<color name="my_custom_color">#000000</color>

2. 扩展ColorScheme获取自定义颜色
   通过LocalContext获取资源中的颜色，自动适配当前主题：

import androidx.compose.material3.ColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext
import androidx.core.content.ContextCompat

// 扩展ColorScheme，添加自定义颜色属性
val ColorScheme.myCustomColor: Color
    @Composable
    get() = Color(ContextCompat.getColor(LocalContext.current, R.color.my_custom_color))

3. 在Compose中使用
   直接通过MaterialTheme.colorScheme获取自定义颜色：

@Composable
fun MyCustomView() {
    Box(
        modifier = Modifier
            .size(24.dp)
            .background(MaterialTheme.colorScheme.myCustomColor)
    )
}

方法二：在主题创建时手动指定明暗颜色 #

如果偏好完全在Compose代码中管理颜色，可以在创建明暗ColorScheme时分别定义自定义颜色，再通过扩展获取：

1. 定义明暗ColorScheme

import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.darkColorScheme
import androidx.compose.material3.lightColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color

// 亮色主题颜色配置
private val LightColorScheme = lightColorScheme(
    primary = Color(0xFF6200EE),
    // 自定义颜色
    onPrimary = Color.White
    // 可添加更多自定义颜色变量
)

// 暗色主题颜色配置
private val DarkColorScheme = darkColorScheme(
    primary = Color(0xFFBB86FC),
    // 对应暗色模式的自定义颜色
    onPrimary = Color.Black
)

// 扩展ColorScheme，暴露自定义颜色
val ColorScheme.myCustomColor: Color
    get() = onPrimary // 可直接复用已定义颜色，也可单独扩展

2. 应用主题

@Composable
fun AppTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {
    val colorScheme = if (darkTheme) DarkColorScheme else LightColorScheme

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

方法三：动态判断主题模式 #

如果需要在代码中动态判断当前主题模式，可通过LocalConfiguration实现：

import androidx.compose.material3.ColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalConfiguration
import android.content.res.Configuration

val ColorScheme.myCustomColor: Color
    @Composable
    get() = when {
        LocalConfiguration.current.uiMode and Configuration.UI_MODE_NIGHT_MASK == Configuration.UI_MODE_NIGHT_YES ->
            Color.Black
        else ->
            Color.White
    }

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