WindowIconDropdownMenu

WindowIconDropdownMenu 是基于 IconButton 的封装，点击图标按钮后会展开 WindowDropdownPopup（通过 Dialog 在窗口级别渲染）。适用于工具栏的 action 槽位，例如 TopAppBar 的右侧动作按钮——单个图标按钮展开后呈现一组动作、排序选项或筛选开关。与 OverlayIconDropdownMenu 不同，它不需要 Scaffold。

引入

kotlin

import top.yukonga.miuix.kmp.menu.WindowIconDropdownMenu
import top.yukonga.miuix.kmp.basic.DropdownEntry
import top.yukonga.miuix.kmp.basic.DropdownItem

基本用法

将 WindowIconDropdownMenu 放在 TopAppBar（或 SmallTopAppBar）的 actions 槽中，点击图标即可展开弹出框。这是最典型的使用场景——工具栏上的一个图标按钮，展开后呈现一组菜单项。与 OverlayIconDropdownMenu 不同，菜单本身不要求外层有 Scaffold，但承载 TopAppBar 的最自然方式仍然是 Scaffold。

kotlin

val entry = DropdownEntry(
    items = listOf("编辑", "复制", "分享", "删除").map { text ->
        DropdownItem(text = text, onClick = { /* 处理动作 */ })
    }
)

Scaffold(
    topBar = {
        SmallTopAppBar(
            title = "收件箱",
            actions = {
                WindowIconDropdownMenu(entry = entry) {
                    Icon(imageVector = MiuixIcons.Edit, contentDescription = "动作菜单")
                }
            }
        )
    }
) { padding ->
    // 页面内容
}

排序 / 单选

对于排序菜单或单选场景，在每个 DropdownItem 上设置 selected，并保持 collapseOnSelection = true（entry 重载的默认值），让弹出框在每次选中后自动关闭。

kotlin

var sortIndex by remember { mutableStateOf(0) }
val entry = DropdownEntry(
    items = listOf("名称", "日期", "大小").mapIndexed { index, text ->
        DropdownItem(text = text, selected = sortIndex == index, onClick = { sortIndex = index })
    }
)

WindowIconDropdownMenu(entry = entry) {
    Icon(imageVector = MiuixIcons.Sort, contentDescription = "排序")
}

多选

用一个 Set 跟踪选中值，在每个条目的 onClick 中切换状态，并设置 collapseOnSelection = false 让弹出框在多次选择之间保持打开。

kotlin

var selected by remember { mutableStateOf(setOf("照片")) }
val entry = DropdownEntry(
    items = listOf("照片", "视频", "文件").map { text ->
        DropdownItem(
            text = text,
            selected = text in selected,
            onClick = {
                selected = if (text in selected) selected - text else selected + text
            }
        )
    }
)

WindowIconDropdownMenu(entry = entry, collapseOnSelection = false) {
    Icon(imageVector = MiuixIcons.SelectAll, contentDescription = "多选")
}

分组菜单

传入 entries: List<DropdownEntry> 即可显示由分割线隔开的多个分组。

kotlin

val entries = listOf(
    DropdownEntry(items = listOf("条目 A-1", "条目 A-2").map { DropdownItem(text = it) }),
    DropdownEntry(items = listOf("条目 B-1", "条目 B-2", "条目 B-3").map { DropdownItem(text = it) })
)

WindowIconDropdownMenu(entries = entries) {
    Icon(imageVector = MiuixIcons.MoreCircle, contentDescription = "更多")
}

组件状态

禁用状态

kotlin

WindowIconDropdownMenu(
    entry = DropdownEntry(items = listOf(DropdownItem(text = "选项 1"))),
    enabled = false
) {
    Icon(imageVector = MiuixIcons.MoreCircle, contentDescription = "更多")
}

当所有 DropdownEntry 都不包含任何条目时，菜单也会被隐式禁用。

属性