HarmonyOS应用开发实战：猫猫大作战-弹出菜单的实现

前言弹出菜单Menu/ContextMenu是移动应用中的快捷操作入口——长按某个元素后弹出操作列表。HarmonyOS 通过bindContextMenu和Menu组件实现弹出菜单。本文以「猫猫大作战」的猫咪长按菜单为锚点讲解弹出菜单的实现。提示本系列不讲 ArkTS 基础语法与环墋搭建假设你已跟完第 1–99 篇。本篇是阶段三第 100 篇。一、Menu 基本用法1.1 bindContextMenuColumn() { Text( 长按我) } .bindContextMenu(this.CatMenu(), true) // true 长按触发1.2 菜单构建Builder CatMenu() { Menu() { MenuItem({ content: 查看详情, onClick: () {} }) MenuItem({ content: 合并, onClick: () {} }) MenuItem({ content: 删除, onClick: () {} }) } }二、游戏中的应用CatCard({ cat: item }) .bindContextMenu(this.CatContextMenu(item), true) Builder CatContextMenu(cat: Cat) { Menu() { MenuItem({ content: ${CatConfig[cat.level].name} }) MenuItem({ content: 查看详情, onClick: () this.showDetail(cat) }) MenuItem({ content: 合并优先, onClick: () this.mergePriority(cat) }) } }三、总结Menu 通过 bindContextMenu 绑定到组件长按触发弹出操作列表。核心要点.bindContextMenu(builder, isLongPress)绑定菜单MenuMenuItem构建菜单项适合长按列表项弹出操作的场景下一篇预告第 101 篇将深入 anchorPosition——菜单锚点定位。如果这篇文章对你有帮助欢迎点赞、收藏⭐、关注你的支持是我持续创作的动力相关资源Menu API 参考bindContextMenu开源鸿蒙跨平台社区第 99 篇bindSheet第 101 篇anchorPosition