Android Compose 下拉选择框 ExposedDropdownMenu下拉选择

复制代码
/**
 * @author   创建人:蒙石瑞
 * @date     创建时间:2024/8/23 10:57
 * @Description    创建内容:下拉选择框
 */
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CustomExposedDropdownMenu(
    options: List<out DropdownMenuDes>,
    labelStr: String,
    onSelect: (DropdownMenuDes) -> Unit
) {

    var expanded by remember {
        mutableStateOf(false)
    }
    var selectedOptionText by remember { mutableStateOf("") }
    ExposedDropdownMenuBox(
        expanded = expanded,
        onExpandedChange = {
            expanded = !expanded
        },
    ) {
        CustomOutlinedTextField(
            value = selectedOptionText,
            onValueChange = { selectedOptionText = it },
            trailingIcon = {
                ExposedDropdownMenuDefaults.TrailingIcon(
                    expanded = expanded
                )
            },
            label = { Text(labelStr) },
            singleLine = true,
            colors = OutlinedTextFieldDefaults.colors(
                focusedBorderColor = Color.Blue,
                unfocusedBorderColor = Color.White,
                cursorColor = Color.Black,
                focusedContainerColor = Color.White,
                unfocusedContainerColor = Color.White,
                focusedLabelColor = Color.Blue,
                disabledLabelColor = Color.Black

            ),
            modifier = Modifier
                .width(120.dp)
                .height(50.dp)
                .menuAnchor(),
            readOnly = true,
            contentPadding = PaddingValues(start = 5.dp, end = 2.dp),
        )
        ExposedDropdownMenu(
            expanded = expanded,
            onDismissRequest = { expanded = false },
            modifier = Modifier.heightIn(max = 250.dp)
        ) {

            options.forEach { option ->
                DropdownMenuItem(text = { Text(option.showName) }, onClick = {
                    selectedOptionText = option.showName
                    expanded = false
                    onSelect(option)
                })
            }
        }

    }
}

使用

复制代码
abstract class DropdownMenuDes(val showName: String, val showId: String)

 val tempShow = listOf(
                            DropdownMenuInfo("one", "xxxx"),
                            DropdownMenuInfo("2222", "xxxx"),
                            DropdownMenuInfo("33333", "xxxx"),
                            DropdownMenuInfo("4444", "xxxx"),
                            DropdownMenuInfo("5555", "xxxx"),
                            DropdownMenuInfo("666", "xxxx"),
                            DropdownMenuInfo("777", "xxxx"),
                            DropdownMenuInfo("999", "xxxx"),
                            DropdownMenuInfo("1010", "xxxx")
                        )
                        Row {
                            CustomExposedDropdownMenu(tempShow, "垛位") { item ->
                                ToastUtil.showToast(item.showName)
                            }
                        }
相关推荐
盼哥PyAI实验室1 分钟前
从搭建到打磨:我的纯前端个人博客开发复盘
前端·javascript
前端初见2 分钟前
2025前端面试题大合集
前端
用户69371750013843 分钟前
一文彻底搞懂 Android 依赖配置:implementation vs testImplementation,再也不混淆!
android
用户9047066835719 分钟前
vue3.5新特性——useTemplateRef
前端
嘉琪00135 分钟前
vue3+ts面试题(一)JSX,SFC
前端·javascript·react.js
何贤1 小时前
🪐 行星科技概念官网!Hero Section 回归!(Three.js ✨)
前端·javascript·three.js
前端拿破轮1 小时前
ReactNative从入门到性能优化(一)
前端·react native·客户端
码界奇点1 小时前
Java Web学习 第1篇前端基石HTML 入门与核心概念解析
java·前端·学习·xhtml
云枫晖1 小时前
Webpack系列-开发环境
前端·webpack
Rverdoser1 小时前
制作网站的价格一般由什么组成
前端·git·github