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)
                            }
                        }
相关推荐
私人珍藏库1 分钟前
【Android】Shizuku升级版-Stellar-提高软件权限
android·app·工具·软件·多功能
白毛大侠5 分钟前
# MySQL InnoDB 隔离级别与 MVCC 完全解析
android·数据库·mysql
接着奏乐接着舞。2 小时前
部署BFF与前端的踩坑与经验记录
前端·node.js
小李子呢02119 小时前
前端八股CSS(2)---动画的实现方式
前端·javascript
GreenTea10 小时前
从 Claw-Code 看 AI 驱动的大型项目开发:2 人 + 10 个自治 Agent 如何产出 48K 行 Rust 代码
前端·人工智能·后端
冬奇Lab11 小时前
MediaPlayer 播放器架构:NuPlayer 的 Source/Decoder/Renderer 三驾马车
android·音视频开发·源码阅读
渣渣xiong11 小时前
从零开始:前端转型AI agent直到就业第五天-第十一天
前端·人工智能
布局呆星11 小时前
Vue3 | 组件通信学习小结
前端·vue.js
C澒11 小时前
IntelliPro 企业级产研协作平台:前端智能生产模块设计与落地
前端·ai编程