如何更改jetpack compose中文本字段的边框颜色？

Question

我试图在 jetpack compose 中为文本字段提供边框颜色，但我找不到有关文本字段边框颜色或布局颜色的信息，我刚刚找到了有关如何更改轮廓文本字段的布局或边框颜色的信息。有没有类似outlinetextfield的解决方案？在文本字段？

我想这样做，但对于文本字段

如何从 jetpack compose 更改 OutlinedTextField 的轮廓颜色？

听到的是我的文本字段代码：

TextField(
                value = currentWeight,
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(5.dp),
                onValueChange = { currentWeight = it },
                label = { Text(text = "Mevcut kilon (kg)") },
                shape = RoundedCornerShape(5.dp),
                colors = TextFieldDefaults.textFieldColors(
                    textColor = Grey2,
                    disabledTextColor = Color.Transparent,
                    backgroundColor = Grey3,
                    focusedIndicatorColor = Color.Transparent,
                    unfocusedIndicatorColor = Color.Transparent,
                    disabledIndicatorColor = Color.Transparent,
                )
            )

结果：

我在文本字段颜色部分添加了聚焦标签颜色，但它不起作用

编辑 我这样做@Gabriele Mariotti 但有一些问题

val interactionSource = remember { MutableInteractionSource() }
            val isFocused = interactionSource.collectIsFocusedAsState()
            val shape = RoundedCornerShape(2.dp)
            val borderModifier = if (isFocused.value) Modifier.border(1.dp,Red, shape) else Modifier
            val singleLine = true
            val enabled = true
            BasicTextField(
                value = currentWeight,
                onValueChange = { currentWeight = it },
                interactionSource = interactionSource,
                enabled = enabled,
                singleLine = singleLine,
                modifier =  borderModifier.background(
                    color = TextFieldDefaults.textFieldColors().backgroundColor(true).value,
                    shape = shape
                )
            ) {
                TextFieldDefaults.TextFieldDecorationBox(
                    value = currentWeight,
                    innerTextField = it,
                    singleLine = singleLine,
                    enabled = enabled,
                    label = { Text("Label") },
                    placeholder = { Text("Placeholder") },
                    visualTransformation = VisualTransformation.None,
                    interactionSource = interactionSource,
                    colors = TextFieldDefaults.textFieldColors()
                )
            }

问题

TextFieldDefaults.TextFieldDecorationBox
And `Text()` 

TextFieldDecorationBox 为红色，错误为

Unresolved reference: TextFieldDecorationBox

---

 label = { Text("Label") },
 placeholder = { Text("Placeholder") },

短信错误

@Composable invocations can only happen from the context of a @Composable function

Answer 1

您可以使用

BasicTextField

应用

border

修饰符和

TextFieldDecorationBox

。

类似：

    val isFocused = interactionSource.collectIsFocusedAsState()
    val shape = RoundedCornerShape(2.dp)
    val borderModifier = if (isFocused.value) Modifier.border(1.dp,Red, shape) else Modifier

    BasicTextField(
        value = value,
        onValueChange = { value = it },
        interactionSource = interactionSource,
        enabled = enabled,
        singleLine = singleLine,
        modifier =  borderModifier.background(
            color = TextFieldDefaults.textFieldColors().backgroundColor(enabled).value,
            shape = shape
        )
    ) {
        TextFieldDefaults.TextFieldDecorationBox(
            value = value,
            innerTextField = it,
            singleLine = singleLine,
            enabled = enabled,
            label = { Text("Label") },
            placeholder = { Text("Placeholder") },
            visualTransformation = VisualTransformation.None,
            interactionSource = interactionSource,
            colors = TextFieldDefaults.textFieldColors()
        )
    }

Answer 2

您可以使背景透明并向修改器添加边框以创建线条。这是一个例子：

TextField(
        value = "",
        modifier = Modifier
            .fillMaxWidth()
            .padding(5.dp)
            .border(width = 1.dp, shape = RoundedCornerShape(4.dp), color = Color.Gray),
        onValueChange = { },
        label = {
            Text(text = "Mevcut kilon (kg)")
                },
        shape = RoundedCornerShape(5.dp),
        colors = TextFieldDefaults.textFieldColors(
            textColor = Color.Gray,
            disabledTextColor = Color.Transparent,
            backgroundColor =  Color.Transparent,
            focusedIndicatorColor = Color.Transparent,
            unfocusedIndicatorColor = Color.Transparent,
            disabledIndicatorColor = Color.Transparent,
        ),
    )

`