Мобильная версияЯ создаю образец экрана в Compose, где мне нужно показать раскрывающийся список с предложениями, пока пользователь печатает, не теряя при этом фокуса TextField.
Желаемый результат
Когда я использовал ExposeDropdownMenuBox, раскрывающийся список отображается поверх TextField.
@Композитный весело AutoCompleteTextView( модификатор: Модификатор = Модификатор, textFieldValue: TextFieldValue = TextFieldValue(), onTextChanged: ((TextFieldValue) -> Единица измерения) = ::onTextChnaged, textStyle: TextStyle = TextStyle.Default, SingleLine: логическое значение = ложь ) { val options = listOf("Вариант 1", "Вариант 2", "Вариант 3", "Вариант 4", "Вариант 5") var isDropdownVisible, запомнив {mutableStateOf(false)} var расширяется с помощью Remember {mutableStateOf(false)} var selectedOptionText, запомнив {mutableStateOf("") } ОткрытыйDropdownMenuBox( модификатор = Модификатор, расширенный = расширенный, onExpandedChange = {расширено = это }) { Текстовое поле( значение = значение текстового поля, onValueChange = {значение -> onTextChanged (значение) значение.выбор.начало isDropdownVisible = value.text.isNotEmpty() && value.text.first() == '@' }, label = { Text("Введите здесь текст.") }, TrailingIcon = { ExpedDropdownMenuDefaults.TrailingIcon(расширенный = расширенный)}, текстовый стиль = текстовый стиль, одиночная линия = одиночная линия, модификатор = modifier.menuAnchor(), ) // параметры фильтра на основе значения текстового поля val filteringOptions = options.filter { it.contains(selectedOptionText, ignoreCase = true) } если (filteringOptions.isNotEmpty()) { ОткрытоеВыпадающееМеню( расширенный = расширенный, onDismissRequest = {расширено = ложь}, ) { filteringOptions.forEach {selectionOption -> DropdownMenuItem( текст = {Текст(selectionOption)}, onClick = { selectedOptionText = вариант выбора расширенный = ложь }, contentPadding = ExpededDropdownMenuDefaults.ItemContentPadding, ) } } } } BackHandler (включено = isDropdownVisible) { isDropdownVisible = ложь } } весело onTextChnaged(textFieldValue: TextFieldValue): Unit { }
Выходное изображение
