如何在 Jetpack Compose 上更改 TextField 突出显示的文本颜色？

Question

在当前将我的应用程序转换为 Jetpack compose 时，我在某些情况下遇到了一些问题来调整我当前的调色板。

TextInputLayout我的 xml 文件中有一些从主题上的 SECUNDARY 颜色继承了高亮文本颜色。

<style name="Theme.MyApp" parent="Theme.MaterialComponents.Light.NoActionBar">
    ...
    <item name="colorPrimary">@color/blue</item>
    <item name="colorPrimaryVariant">@color/blue</item>
    <item name="colorSecondary">@color/red</item>
    <item name="colorSecondaryVariant">@color/red</item>
    ...
</style>

问题是我的TextFieldon compose 继承了 PRIMARY 颜色的高亮文本颜色MaterialTheme。

MaterialTheme(
    colors = Colors(
        primary = Color.Blue,
        ...
        secondary = Color.Red,
        ...
    ),
    content = content,
    typography = MaterialTheme.typography,
    shapes = MaterialTheme.shapes,
) {
   TextField(...)
}

我覆盖了colors参数，TextField但似乎没有影响这种颜色。

是否有一种方法可以在不更改colorson 的情况下覆盖 compose 上的突出显示颜色MaterialTheme？我想避免这种情况，因为它可能会在使用相同主题的其他屏幕上引起问题。

Answer 1

文本和文本字段组件用于文本选择的颜色由 提供LocalTextSelectionColors.current。

您可以TextSelectionColors使用以下方法提供自定义：

val customTextSelectionColors = TextSelectionColors(
    handleColor = Red,
    backgroundColor = Red.copy(alpha = 0.4f)
)

CompositionLocalProvider(LocalTextSelectionColors provides customTextSelectionColors) {
    TextField(
        value = text,
        onValueChange = { text = it },
        colors = TextFieldDefaults.textFieldColors(cursorColor = Red)
    )
}

如果您还想更改光标颜色，请添加colors = TextFieldDefaults.textFieldColors(cursorColor = Red).