单击撰写时 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
折叠。
我有一张图片,我想在用户点击图片时显示一个下拉菜单项。我正在调试应用程序,我可以看到代码通过了 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
折叠。