Jetpack Compose：尽管使用了类似问题中批准的解决方案，但当主题为深色时，文本仍保持黑色

Question

StackOverflow 上已经有一个类似的问题了。它有一个全面的、公认的答案，我认为它可以帮助我解决一个看似微不足道的问题。

我有一个由可组合项组成的Text可组合项。之所以这样称呼它，是PickerLabel因为它是更大的选择器组件的一部分：

@Composable
private fun PickerLabel(
    text: String,
    modifier: Modifier
) {
    Text(
        text = text,
        fontSize = 64.sp,
        modifier = modifier
            .pointerInput(Unit) {
                detectTapGestures { }
            }
    )
}

它的使用方式如下（感觉其中没有任何内容modifier可以影响文本颜色）：

PickerLabel(
    text = \* stringText *\,
    modifier = Modifier
        .align(Alignment.Center)
        .alpha(\* stringText *\)
)

从我的代码中看到的最后一件有用的事情是Theme.kt：

private val LightColorPalette = lightColors(
    primary = Jacarta,
    primaryVariant = BlueZodiac,
    secondary = ButterflyBush,
    secondaryVariant = Victoria,
    onPrimary = White,
    onSecondary = White,
    onSurface = White
)

private val DarkColorPalette = darkColors(
    primary = Jacarta,
    primaryVariant = BlueZodiac,
    secondary = ButterflyBush,
    secondaryVariant = Victoria,
    onPrimary = White,
    onSecondary = White,
    onSurface = White
)

@Composable
fun AppTheme(darkTheme: Boolean = isSystemInDarkTheme(), content: @Composable () -> Unit) {
    CompositionLocalProvider(LocalSpace provides Space()) {
        MaterialTheme(
            colors = if (darkTheme) DarkColorPalette else LightColorPalette,
            typography = Typography,
            shapes = Shapes,
            content = content
        )
    }
}

在黑暗模式下的设置PickerLabel如下：

虽然它应该看起来像这样（仅在灯光模式下看起来像这样）：

现在，根据前面提到的问题的答案，我尝试了以下操作：

1. 添加 aSurface作为父容器（onSurface颜色指定为White）Theme.kt：

private val LightColorPalette = lightColors(
    primary = Jacarta,
    primaryVariant = BlueZodiac,
    secondary = ButterflyBush,
    secondaryVariant = Victoria,
    onPrimary = White,
    onSecondary = White,
    onSurface = White
)

private val DarkColorPalette = darkColors(
    primary = Jacarta,
    primaryVariant = BlueZodiac,
    secondary = ButterflyBush,
    secondaryVariant = Victoria,
    onPrimary = White,
    onSecondary = White,
    onSurface = White
)

@Composable
fun AppTheme(darkTheme: Boolean = isSystemInDarkTheme(), content: @Composable () -> Unit) {
    CompositionLocalProvider(LocalSpace provides Space()) {
        MaterialTheme(
            colors = if (darkTheme) DarkColorPalette else LightColorPalette,
            typography = Typography,
            shapes = Shapes,
            content = content
        )
    }
}

2. color在可组合项中使用参数Text：

setContent {
    AppTheme {
        Surface {
            ScreenContent()
        }
    }
}

3. style在可组合项中使用参数Text：

@Composable
private fun PickerLabel(
    text: String,
    modifier: Modifier
) {
    Text(
        text = text,
        color = White,
        fontSize = 64.sp,
        modifier = modifier
            .pointerInput(Unit) {
                detectTapGestures { }
            }
    )
}

4. 使用自定义LocalContentColor覆盖默认Black颜色：

@Composable
private fun PickerLabel(
    text: String,
    modifier: Modifier
) {
    Text(
        text = text,
        style = LocalTextStyle.current.copy(color = White),
        fontSize = 64.sp,
        modifier = modifier
            .pointerInput(Unit) {
                detectTapGestures { }
            }
    )
}

这些解决方案都不适合我 - 每次我尝试它们时，Text无论如何颜色仍然是黑色。

也许有一个不同的因素决定了Text上述答案无法识别的颜色。或者也许我犯了一个错误，可以在我的代码中发现。无论哪种方式，如果您对可能发生的情况有丝毫了解，请提供帮助。

编辑：更改Theme.kt为包括对系统主题的检查，以决定使用哪个调色板。

Answer 1

我已经成功解决了这个问题。解决方案是我从未想过的有意义的事情。

没有包装Surface或指定一些color参数 - 解决方案（至少在我的非常具体的情况下）是：

1. Text从 中解开可组合项PickerLabel，
2. 设置fontSize为63.8.sp（没错 -63.9.sp已经太多并且使文本变成黑色）。

通过这两个（非常令人惊讶和奇怪的）步骤，它Text是由颜色组成的White。除了我所说的之外，没有更改其他代码：

Text(
    text = /* stringText */,
    fontSize = 63.8.sp,
    modifier = modifier
        .align(Alignment.Center)
        .alpha(/* floatAlpha */)
        .pointerInput(Unit) {
            detectTapGestures { }
        }
)