如何更改 Jetpack Compose 中文本字段的邊框顏色？

Question

我正在嘗試為 Jetpack Compose 中的文本字段提供邊框顏色，但我找不到有關文本字段邊框顏色或布局顏色的信息，我剛剛找到了有關如何更改 outlinedtextfield 的布局或邊框顏色的信息。 是否有類似 outl.netextfield 的解決方案？ 在文本字段？

我想這樣做但是對於文本字段

如何從 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,
                )
            )

結果：

我在文本字段 colors 部分添加了重點 label 顏色，但它沒有用

編輯我是這樣做的 @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()
        )
    }