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)
                            }
                        }
相关推荐
秋沐12 分钟前
Vue3实现打印功能
前端·javascript·vue.js
大霞上仙12 分钟前
一个vue前端的例子(六)如何获取table一行的id
前端·javascript·vue.js
张小瑜17 分钟前
elementUI中el-form 嵌套el-from 如何进行表单校验?
前端·vue.js·elementui
盼盼盼24 分钟前
react Refine 框架在性能优化方面有哪些具体的技术手段?
前端·react.js·性能优化
听潮阁29 分钟前
【卷起来】VUE3.0教程-09-整合Element-plus
前端·javascript·vue.js·spring boot·spring cloud
风清云淡_A31 分钟前
react18基础教程系列-- 框架基础理论知识mvc/jsx/createRoot
前端·reactjs
让开,我要吃人了43 分钟前
HarmonyOS应用开发( Beta5.0)HOS-用户认证服务:面部识别
服务器·前端·华为·移动开发·嵌入式·harmonyos·鸿蒙
小小李程序员1 小时前
Redis地理数据类型GEO
前端·redis·bootstrap
时差freebright1 小时前
【Visual Studio 报错】vs 在使用二进制写入文件时弹窗报错:使用简体中文 gb2312 编码加载文件
android·java·visual studio
黑客大佬1 小时前
安全工具 | 使用Burp Suite的10个小tips
运维·前端·网络·学习·安全·云计算·腾讯云