jetpack compose android 中下拉菜单不可见？

Question

DropDownMenu 有一个父框和一个锚按钮，但仍然不可见？我已将其启用为 true，是否缺少某些内容来在 jetpack compose 中显示下拉菜单？

代码如下所述并附有图像

@Composable
fun DropdownButton(buttonText: String, menuList: List<String>) {
    Box(
        

    ) {

        Button(onClick = {}) {
            Text(buttonText)
        }
        DropdownMenu(expanded = true, onDismissRequest = {}, modifier=Modifier.fillMaxSize()) {
            menuList.forEach {
                DropdownMenuItem(onClick = { /*TODO*/ }) {
                    Text(text = it)
                }
            }
        }

    }
}
@Composable
fun UnitConvert(name: String = "Akshay", modifier: Modifier? = null) {

    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
        Column(
            Modifier.fillMaxHeight(),
            verticalArrangement = Arrangement.Center,
            horizontalAlignment = Alignment.CenterHorizontally
        ) {

            Text(text = "Unit Convertor", color = MaterialTheme.colors.primary)
            OutlinedTextField(
                value = "",
                onValueChange = {},
                placeholder = { Text(text = "Enter value") })
            ButtonGroup({DropdownButton(
                buttonText = "Input Unit",
                menuList = listOf("Ton", "Kilogram", "Gram", "Milligram")
            )})

        }

    }


}

Answer 1

我认为发生这种情况是因为

DropdownMenu

设置为

Modifier#fillMaxSize

。另外，对于菜单的动态打开和关闭，我们应该创建一个状态

isExpanded

。

因为，将其转换为可变状态并将其包装在记住块中，使得每次变量值isExpanded发生变化时，UI都会

重新组合

。

我已将代码修改为以下工作状态，请检查。

@Composable
    fun DropdownButton(buttonText: String, menuList: List<String>) {

        var isExpanded by remember { mutableStateOf(false) }

        Box {
            Button(onClick = {
                isExpanded = !isExpanded
            }
            ) {
                Text(buttonText)
            }
            DropdownMenu(
                expanded = isExpanded,
                onDismissRequest = {
                    isExpanded = false
                }
            ) {
                menuList.forEach {
                    DropdownMenuItem(
                        onClick = { /*TODO*/ },
                        text = {
                            Text(text = it)
                        })
                }
            }

        }
    }

    @Composable
    fun UnitConvert(name: String = "Akshay", modifier: Modifier? = null) {

        Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
            Column(
                Modifier.fillMaxHeight(),
                verticalArrangement = Arrangement.Center,
                horizontalAlignment = Alignment.CenterHorizontally
            ) {

                Text(text = "Unit Convertor", color = MaterialTheme.colorScheme.primary)
                OutlinedTextField(
                    value = "",
                    onValueChange = {},
                    placeholder = { Text(text = "Enter value") })

                DropdownButton(
                    buttonText = "Input Unit",
                    menuList = listOf("Ton", "Kilogram", "Gram", "Milligram")
                )
            }
        }
    }