Dropdown

fun Dropdown(value: String, expanded: Boolean, onExpandedChange: (Boolean) -> Unit, onDismissRequest: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, required: Boolean = false, label: String? = null, placeholder: String? = null, helper: String? = null, leadingContent: @Composable AddonScope.() -> Unit? = null, state: TextFieldState? = null, stateMessage: String? = null, visualTransformation: VisualTransformation = VisualTransformation.None, properties: PopupProperties = PopupProperties(focusable = true, dismissOnClickOutside = true), interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, dropdownContent: @Composable ColumnScope.() -> Unit)

Outlined text input to get an input value from a list of elements selectable through a DropdownMenu by the user.

Parameters

value

the input text to be shown in the text field

expanded

Whether Dropdown Menu should be expanded or not

onExpandedChange

Executes when the user clicks on the ExposedDropdownMenuBox

onDismissRequest

Called when the user requests to dismiss the menu, such as by tapping outside the menu's bounds

modifier

a Modifier for this text field

enabled

True controls the enabled state of the TextField. When false, the text field will be neither editable nor focusable, the input of the text field will not be selectable, visually text field will appear in the disabled UI state

required

add an asterisk to the label to indicate that this field is required and read it as "label mandatory" but doesn't do anything else so it's up to the developer to handle the behavior.

label

the optional label to be displayed inside the text field container. The default text style for internal Text is SparkTypography.body2 when the text field is in focus and SparkTypography.body1 when the text field is not in focus

placeholder

the optional placeholder to be displayed when the text field is in focus and the input text is empty. The default text style for internal Text is SparkTypography.body1

helper

The optional helper text to be displayed at the bottom outside the text input container that give some informations about expected text

leadingContent

the optional leading icon to be displayed at the beginning of the text field container

state

indicates the validation state of the text field. The label, outline, leading & trailing content are tinted by the state color.

stateMessage

the optional state text to be displayed at the helper position that give more information about the state, it's displayed only when state is not null.

visualTransformation

transforms the visual representation of the input value For example, you can use PasswordVisualTransformation to create a password text field. By default no visual transformation is applied

properties

commentCountPopupProperties for further customization of this popup's behavior.

interactionSource

the MutableInteractionSource representing the stream of Interactions for this TextField. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this TextField in different Interactions.

dropdownContent

The content to be displayed inside ExposedDropdownMenuBox.


fun Dropdown(value: String, expanded: Boolean, onClick: () -> Unit, onClickLabel: String, modifier: Modifier = Modifier, enabled: Boolean = true, required: Boolean = false, label: String? = null, placeholder: String? = null, helper: String? = null, leadingContent: @Composable AddonScope.() -> Unit? = null, state: TextFieldState? = null, stateMessage: String? = null, visualTransformation: VisualTransformation = VisualTransformation.None, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() })

Outlined text input to get an input value from a list of elements selectable through a custom container (BottomSheet / Dialog / Screen) by the user.

Parameters

value

the input TextFieldValue to be shown in the text field

expanded

Whether Dropdown Menu should be expanded or not

onClick

Called when the user requests to expand the details (in a dropdown, BottomSheet or other container components).

onClickLabel

The label to be used for the onClick action. It is used by accessibility services to describe the action to the user. It should describe where the user will be taken to when the action is performed. For example, "Open check-in selection dates" or "Open category selection".

modifier

a Modifier for this text field

enabled

True controls the enabled state of the TextField. When false, the text field will be neither editable nor focusable, the input of the text field will not be selectable, visually text field will appear in the disabled UI state

required

add an asterisk to the label to indicate that this field is required and read it as "label mandatory" but doesn't do anything else so it's up to the developer to handle the behavior.

label

the optional label to be displayed inside the text field container. The default text style for internal Text is SparkTypography.body2 when the text field is in focus and SparkTypography.body1 when the text field is not in focus

placeholder

the optional placeholder to be displayed when the text field is in focus and the input text is empty. The default text style for internal Text is SparkTypography.body1

helper

The optional helper text to be displayed at the bottom outside the text input container that give some informations about expected text

leadingContent

the optional leading icon to be displayed at the beginning of the text field container

state

indicates the validation state of the text field. The label, outline, leading & trailing content are tinted by the state color.

stateMessage

the optional state text to be displayed at the helper position that give more information about the state, it's displayed only when state is not null.

visualTransformation

transforms the visual representation of the input value For example, you can use PasswordVisualTransformation to create a password text field. By default no visual transformation is applied

interactionSource

the MutableInteractionSource representing the stream of Interactions for this TextField. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this TextField in different Interactions.

See also