coui-ui/io.github.suqi8.coui.kmp.basic/InputView

InputView

fun InputView(value: String, onValueChange: (String) -> Unit, modifier: Modifier = Modifier, title: String = "", label: String = "", enabled: Boolean = true, readOnly: Boolean = false, showCount: Boolean = false, maxCount: Int = 0, showClearButton: Boolean = false, showPasswordToggle: Boolean = false, errorMessage: String = "", cornerRadius: Dp = InputViewDefaults.CornerRadius, colors: InputViewColors = InputViewDefaults.inputViewColors(), textFieldColors: TextFieldColors = TextFieldDefaults.textFieldColors(), textStyle: TextStyle = TextFieldDefaults.textStyle(TextFieldMode.None), keyboardOptions: KeyboardOptions = KeyboardOptions.Default, keyboardActions: KeyboardActions = KeyboardActions.Default, singleLine: Boolean = true, maxLines: Int = if (singleLine) 1 else InputViewDefaults.MaxLines, visualTransformation: VisualTransformation = VisualTransformation.None, leadingIcon: @Composable () -> Unit? = null, trailingIcon: @Composable () -> Unit? = null, interactionSource: MutableInteractionSource? = null)

An InputView component with COUI style — the ColorOS Settings "card input".

Mirrors COUICardSingleInputView / COUICardMultiInputView (coui_single_input_card_view.xml / coui_multi_input_card_view.xml): a white card (couiColorCardBackground, couiRoundCornerM 12dp corners) holding an optional 16sp medium title and a bare, undecorated text field (COUIEditText MODE_BACKGROUND_NO_LINE — no underline, no border), with the trailing counter / clear / password buttons overlaid at the end of the field. The error caption sits below the card (10sp couiColorError, 4dp top padding), fades in over 217ms / out over 283ms with the COUI ease curve, and the field plays the COUI error shake while it is shown.

In the multi-line form (singleLine = false, mirroring COUICardMultiInputView) the counter moves to the bottom-end corner of the card (12sp couiColorLabelTertiary) and its color animates to the error color for 1s when the limit is hit.

When maxCount is greater than 0 the input is hard-limited to that many characters.

Parameters

value

The text to be displayed in the input field.

onValueChange

The callback to be called when the value changes.

modifier

The modifier to be applied to the InputView.

title

The title displayed above the input field, inside the card. Hidden when empty.

label

The label (hint) of the inner TextField, shown while the field is empty.

enabled

Whether the InputView is enabled.

readOnly

Whether the input field is read-only.

showCount

Whether to show the "length/max" counter. Only shown when maxCount is greater than 0 (COUIInputView couiEnableInputCount).

maxCount

The maximum number of characters. 0 means unlimited.

showClearButton

Whether to show a clear button while the field is focused and not empty (COUIEditText quickDelete).

showPasswordToggle

Whether to show the password eye toggle (COUIInputView couiEnablePassword). While the password is hidden the text is masked.

errorMessage

The error message displayed below the card. Empty hides the error line.

cornerRadius

The corner radius of the card (COUI couiRoundCornerM).

colors

The InputViewColors applied to the card, title, counter and error line. Use InputViewDefaults.inputViewColors to customize.

textFieldColors

The TextFieldColors applied to the inner TextField.

textStyle

The text style to be applied to the input text (COUI couiTextBodyL: 16sp regular).

keyboardOptions

The keyboard options to be applied to the input field.

keyboardActions

The keyboard actions to be applied to the input field.

singleLine

Whether the input field is single line (COUICardSingleInputView). Set to false for the multi-line card form (COUICardMultiInputView).

maxLines

The maximum number of lines allowed to be displayed (COUIInputView MAX_LINE).

visualTransformation

The visual transformation to be applied to the input field.

leadingIcon

The leading icon to be displayed in the input field.

trailingIcon

The trailing icon to be displayed after the built-in trailing buttons.

interactionSource

The interaction source to be applied to the input field.