#鸿蒙通关秘籍#如何在鸿蒙中实现自定义菜单样式？

当默认菜单不满足需求时，可以通过@Builder实现自定义菜单样式。以下为自定义样式菜单的实现：

bash class Tmp { iconStr2: ResourceStr = $r("app.media.view_list_filled")

set(val: Resource) { this.iconStr2 = val; } }

@Entry @Component struct menuExample { @State select: boolean = true; private iconStr: ResourceStr = $r("app.media.view_list_filled"); private iconStr2: ResourceStr = $r("app.media.view_list_filled");

@Builder SubMenu() { Menu() { MenuItem({ content: "复制", labelInfo: "Ctrl+C" }) MenuItem({ content: "粘贴", labelInfo: "Ctrl+V" }) } }

@Builder MyMenu() { Menu() { MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }).enabled(false) MenuItem({ startIcon: this.iconStr, content: "菜单选项", endIcon: $r("app.media.arrow_right_filled"), builder: this.SubMenu }) MenuItemGroup({ header: '小标题' }) { MenuItem({ content: "菜单选项" }) .selectIcon(true) .selected(this.select) .onChange((selected) => { console.info("menuItem select" + selected); let Str: Tmp = new Tmp(); Str.set($r("app.media.icon")); }) MenuItem({ startIcon: $r("app.media.view_list_filled"), content: "菜单选项", endIcon: $r("app.media.arrow_right_filled"), builder: this.SubMenu }) }

  MenuItem({
    startIcon: this.iconStr2,
    content: "菜单选项",
    endIcon: $r("app.media.arrow_right_filled")
  })
}
1.
2.
3.
4.
5.
6.

} }