How can the cursor in an OutlinedTextField
be hidden? I tried the following, but it doesn't seem to work. My input needs a border, so I don't think I can use another component than OutlinedTextField
.
OutlinedTextField(
value = "",
onValueChange = {},
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
singleLine = true,
maxLines = 1,
shape = inputCornerShape,
colors = TextFieldDefaults.outlinedTextFieldColors(
focusedBorderColor = Color(0xFF6650a4),
unfocusedBorderColor = Color(0xFF625b71),
cursorColor = Color.Transparent,
errorCursorColor = Color.Transparent
),
modifier = Modifier
.fillMaxWidth()
.weight(1f)
.wrapContentHeight()
.indicatorLine(
enabled = false,
isError = false,
interactionSource = interactionSource,
colors = TextFieldDefaults.textFieldColors(
disabledIndicatorColor = Color.Transparent,
focusedIndicatorColor = Color.Transparent,
unfocusedIndicatorColor = Color.Transparent,
errorIndicatorColor = Color.Transparent,
cursorColor = Color.Transparent,
errorCursorColor = Color.Transparent
),
focusedIndicatorLineThickness = 0.dp,
unfocusedIndicatorLineThickness = 0.dp
)
)
CodePudding user response:
You can hide the cursor using cursorColor = Color.Transparent
in the colors
attribute. You should also apply the same color to the text selection applying a custom TextSelectionColors
:
val customTextSelectionColors = TextSelectionColors(
handleColor = Color.Transparent,
backgroundColor = Color.Transparent
)
CompositionLocalProvider(LocalTextSelectionColors provides customTextSelectionColors) {
OutlinedTextField(
value = text,
onValueChange = { text = it },
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
singleLine = true,
maxLines = 1,
colors = TextFieldDefaults.outlinedTextFieldColors(
focusedBorderColor = Color(0xFF6650a4),
unfocusedBorderColor = Color(0xFF625b71),
cursorColor = Color.Transparent,
errorCursorColor = Color.Transparent
),
modifier = Modifier
.fillMaxWidth()
.wrapContentHeight()
)
}
CodePudding user response:
Alright, so I found out that apparently settings the cursor color only didn't work when I set it from a parameter (like in my question). As soon as I copied the default value of the parameter and pasted it as the value of color
it started working. That's when I realised I didn't include cursorColor
and errorCursorColor
when instantiating my Composable. I added other colors there, but not these ones. I thought they would be added, but instead, the entire TextFieldColors
object is overwritten (obviously). When I added cursorColor
and errorCursorColor
here too, it started working. Derp.