Jetpack Compose安卓应用文本颜色莫名切换问题求助

问题背景 #

使用Jetpack Compose开发应用，固定使用浅色主题（未支持动态颜色/明暗切换），但在Android 10设备上，LoadingIcon组件内的文本会先显示黑色，约1秒后变为白色；Android 11及以上设备无此问题。已尝试硬编码文本颜色、使用样式、用主题包裹文本等方法，均无效。

可能原因与解决方案 #

1. 明确指定文本颜色并确保初始化时立即应用 #

Android 10及以下系统中，Compose可能存在初始主题属性未及时传递的情况，导致文本先使用系统默认黑色，后续才同步到主题颜色。可以直接在Text组件中硬编码颜色，或直接引用主题固定色值：

text?.let {
    Text(
        text = it,
        color = Color.White // 或使用主题色：MaterialTheme.colorScheme.onSurface
    )
}

2. 让LoadingIcon独立绑定主题 #

在LoadingIcon内部明确包裹自定义主题，避免因父组件主题传递延迟导致的颜色异常：

@Composable
fun LoadingIcon(text: String?) {
    MarkettrackerTheme {
        Column(
            verticalArrangement = Arrangement.Center,
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Image(
                painter = painterResource(id = R.drawable.mt_logo),
                contentDescription = "LoadingIcon",
                modifier = Modifier.rotate(rotation)
            )
            text?.let {
                Text(text = it, color = MaterialTheme.colorScheme.onSurface)
            }
        }
    }
}

3. 升级Compose依赖版本 #

部分旧版本Compose在Android 10上存在主题初始化延迟的bug，建议升级到最新稳定版依赖：

// build.gradle.kts 示例
implementation(platform("androidx.compose:compose-bom:2024.06.00"))
implementation("androidx.compose.material3:material3")
implementation("androidx.compose.ui:ui")

4. 排查状态更新与过渡动画影响 #

• 检查isLoading状态的切换逻辑，确认是否间接触发了主题或颜色变化
• 暂时注释NavHost的过渡动画，测试是否是动画导致的颜色切换异常：

NavHost(
    navController = navController,
    startDestination = Destination.HOME.route,
    // 临时注释过渡效果
    // enterTransition = { fadeIn(tween(400)) },
    // exitTransition = { fadeOut(tween(200)) },
    modifier = Modifier.padding(it)
) {
    // ... 导航路由代码
}

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