公开的下拉菜单未展开以显示完整列表

Question

我正在尝试使用 ExposedDropDownMenu 但扩展不够。它展开后仅显示列表中的第一项。

我关注了以下 Stackoverflow thread。

这是完整的代码：

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun Combobox() {
val contextForToast = LocalContext.current.applicationContext
val listItems = arrayOf("Favorites", "Options", "Settings", "Share")

// state of the menu
var expanded by remember {
    mutableStateOf(false)
}

// remember the selected item
var selectedItem by remember {
    mutableStateOf(listItems[0])
}

// box
ExposedDropdownMenuBox(
    expanded = expanded,
    onExpandedChange = {
        expanded = !expanded
    }
) {
    OutlinedTextField(
        value = selectedItem,
        onValueChange = { selectedItem = it },
        modifier = Modifier.menuAnchor(),
        //readOnly = true,
        label = { Text(text = "Label") },
        trailingIcon = {
            ExposedDropdownMenuDefaults.TrailingIcon(
                expanded = expanded
            )
        },
        colors = ExposedDropdownMenuDefaults.textFieldColors()
    )

    // filter options based on text field value
    val filteringOptions =
        listItems.filter { it.contains(selectedItem, ignoreCase = true) }

    if (filteringOptions.isNotEmpty()) {
        // menu
        ExposedDropdownMenu(
            expanded = expanded,
            onDismissRequest = { expanded = false }
        ) {
            // this is a column scope
            // all the items are added vertically
            filteringOptions.forEach { selectionOption ->
                // menu item
                DropdownMenuItem(
                    text = {Text(text = selectionOption)},
                    onClick = {
                        selectedItem = selectionOption
                        Toast.makeText(contextForToast, selectedItem, Toast.LENGTH_SHORT).show()
                        expanded = false
                    },
                    contentPadding = ExposedDropdownMenuDefaults.ItemContentPadding,
                )
            }
        }
    }
}

}

我用只读 true 和 false 测试了它，但没有任何区别

Answer 1

我确定了问题的原因。

val filteringOptions = 
    listItems.filter { it.contains("$selectedItem", ignoreCase = true) }

过滤代码需要细化。

这将选择项目限制为仅一项或具有相同字符的项目。 （红色、红地毯等如果所选项目==红色）