如何使按钮成为 Jetpack Compose 中的菜单触发器？

Question

我尝试添加一个 IconButton() 并想点击按钮将其打开或关闭（同时 点击其他地方关闭它)

但是发生了一个有趣的问题。

触发按钮包含在“其他地方”中，当我点击按钮关闭菜单时，这个先触发onDismissRequest()，然后触发按钮的onClick()，这让我无法关闭菜单（点击后会立即关闭然后再次打开）

Scaffold(
    ...
    topBar = {
        TopAppBar(
            ...
            actions = {
                var menuExpanded by remember { mutableStateOf(false) }

                Box {
                    IconButton(onClick = { menuExpanded = !menuExpanded}) {
                        Icon(
                            painter = painterResource(id = R.drawable.menu),
                            contentDescription = "menu",
                            tint = white
                        )
                    }

                    DropdownMenu(
                        expanded = menuExpanded,
                        properties = PopupProperties(),
                        onDismissRequest = { menuExpanded = false }
                    ) {
                        // items
                    }
                }
            }
        )
    }
) { ... }

我知道我可以设置 Modifier.offset() 让菜单遮住按钮，但我不想那样做。

我该怎么办？

Answer 1

这就是 PopupProperties.focusable 的用途：true 值可防止在菜单打开时点击其他视图。顺便说一下，如果你不指定 properties 选项，这是默认值。

DropdownMenu(
    expanded = menuExpanded,
    properties = PopupProperties(focusable = true),
    onDismissRequest = { menuExpanded = false }
) {

如何使按钮成为 Jetpack Compose 中的菜单触发器？

How to make a button a menu trigger in Jetpack Compose?

kotlin

android-jetpack-compose