Я создаю компонуемую функцию автозаполнения на основе этого ответа:
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun AutoComplete(
labelText: String,
options: List<String>,
value: String,
onValueChange: (String) -> Unit,
modifier: Modifier = Modifier,
keyboardOptions: KeyboardOptions = KeyboardOptions.Default,
) {
var expanded = value.length > 2
val filterOpts = options.filter { it.contains(value, ignoreCase = true) }
ExposedDropdownMenuBox(
expanded = expanded,
onExpandedChange = { expanded = !expanded }) {
TextField(
label = { Text(text = labelText) },
readOnly = true,
value = value,
onValueChange = onValueChange,
colors = ExposedDropdownMenuDefaults.textFieldColors(),
modifier = modifier.menuAnchor(),
keyboardOptions = keyboardOptions,
)
if (!filterOpts.isEmpty()) {
ExposedDropdownMenu(
expanded = expanded,
onDismissRequest = { expanded = false }) {
filterOpts.forEach { option ->
DropdownMenuItem(
text = { Text(text = option) },
onClick = {
onValueChange(option)
expanded = false
}
)
}
}
}
}
}
Я использую это так:
val names = listOf("Tony Stark", "Steve Rogers", "Bruce Banner", "Natasha Romanoff")
var name by remember {
mutableStateOf("")
}
AutoComplete(
labelText = "Name",
options = names,
value = name,
onValueChange = { name = it },
)
Когда я запускаю это и фокусируюсь на поле «Имя», у меня нет экранной клавиатуры в эмуляторе, и набор текста на моем ноутбуке ничего не дает. Что мне не хватает? Как сфокусировать внимание ребенка TextField
, чтобы система автоматически показывала клавиатуру?
Если вам нужна клавиатура, не устанавливайте readOnly = true
.
Кроме того, я не знаю, чего вы пытаетесь достичь, но var expanded = value.length > 2
будет держать раскрывающееся меню открытым даже после выбора опции. Чтобы избежать этого, вы можете объявить expanded
как обычное запоминаемое логическое значение:
var expanded by remember { mutableStateOf(false) }
И проверяйте длину значения только после изменения значения в TextField
:
onValueChange = {
expanded = value.length > 2
onValueChange(it)
},
Ааа...
readOnly = true
почти наверняка проблема. Это артефакт копирования и вставки из похожей сборки, которую я сделал, под названиемSelect
. Что касаетсяvar expanded = value.length > 2
, намерение состоит в том, чтобы автозаполнение начиналось после ввода двух символов, но из-за нарушения редактирования я не смог проверить, работает ли это так, как задумано.