单击撰写时 DropDownMenu 不显示

DropDownMenu not showing when click in compose

我有一张图片,我想在用户点击图片时显示一个下拉菜单项。我正在调试应用程序,我可以看到代码通过了 DropdownDemo 方法,但没有显示任何内容。

我是不是做错了什么?

点击验证码:

@Composable
fun Header(currentItem: CartListItems) {
    var showDialog by remember { mutableStateOf(false) }

    Box(Modifier.fillMaxWidth()) {
        Text(modifier = Modifier.align(Alignment.TopStart),
            text = currentItem.type,
            color = colorResource(id = R.color.app_grey_dark),
            fontSize = 12.sp)
        Image(painter = painterResource(R.drawable.three_dots),
            contentDescription = "more options button",
            Modifier
                .align(Alignment.CenterEnd)
                .width(24.dp)
                .height(6.75.dp)
                .clickable(indication = null,
                    interactionSource = remember { MutableInteractionSource() },
                    onClick = {
                        showDialog = true
                    }))

        if(showDialog) {
            DropdownDemo()
            showDialog = false
        }
    }
}

下拉菜单:

@Composable
fun DropdownDemo() {
    var expanded by remember { mutableStateOf(false) }
    val items = listOf("A", "B", "C", "D", "E", "F")
    val disabledValue = "B"
    var selectedIndex by remember { mutableStateOf(0) }
    Box(modifier = Modifier
        .fillMaxSize()
        .wrapContentSize(Alignment.TopStart)) {
        Text(items[selectedIndex],modifier = Modifier
            .fillMaxWidth()
            .clickable(onClick = { expanded = true })
            .background(
                Color.Gray
            ))
        DropdownMenu(
            expanded = expanded,
            onDismissRequest = { expanded = false },
            modifier = Modifier
                .fillMaxWidth()
                .background(
                    Color.Red
                )
        ) {
            items.forEachIndexed { index, s ->
                DropdownMenuItem(onClick = {
                    selectedIndex = index
                    expanded = false
                }) {
                    val disabledText = if (s == disabledValue) {
                        " (Disabled)"
                    } else {
                        ""
                    }
                    Text(text = s + disabledText)
                }
            }
        }
    }
}

showDialog 似乎是一个 MutableState 对象。因此,当图像被点击时,它变成true,并触发重组,然后执行条件块,显示DropDownMenu。但是,在下一行。您将 showDialog 等同于 false,重新触发重组,并呈现 DropDownMenu 折叠。