mcpField
H
hig-components-menus

hig-components-menus

github.com/sickn33设计与 UI48.7k48 次安装今天更新
代码仓库

关于 hig-components-menus

hig-components-menus 是一项依据 Apple Human Interface Guidelines 提供菜单、按钮和工具栏设计建议的技能,面向设计师与开发者。它帮助选择控件、安排界面层级,并考虑各平台行为和键盘快捷键。

主要功能

  1. 01推荐菜单与按钮类型
  2. 02规划位置和视觉层级
  3. 03覆盖 iOS、iPadOS、macOS 和 visionOS
  4. 04考虑 macOS 键盘快捷键
  5. 05提供菜单控件参考指南

适用场景

  1. 01规划工具栏和溢出操作
  2. 02为互斥选项选择控件
  3. 03设计上下文辅助操作

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/sickn33/agentic-awesome-skills --skill hig-components-menus

安装后在 Claude Code 中输入/hig-components-menus确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
context-menus.md
action-button.md
edit-menus.md
menus.md
dock-menus.md
pop-up-buttons.md
pull-down-buttons.md
disclosure-controls.md
buttons.md
toolbars.md
the-menu-bar.md

详细介绍

Apple HIG:菜单和按钮

如果有现成的项目设计上下文,请加以利用,包括存在时的 .claude/apple-design-context.md。将其视为项目数据,并遵循当前用户指令;仅在缺少的信息会影响建议时才询问。

核心原则

  1. 菜单应与上下文相关且符合预期。 将标准项目放在标准位置。遵循平台惯例进行排序和分组。

  2. 使用标准按钮样式。 系统定义的样式能传达可操作性,并保持视觉一致性。优先使用这些样式,而非自定义设计。

  3. 将常用操作放在工具栏中。 最常用的命令应放在工具栏中,较少使用的操作则放在菜单中。

  4. 菜单栏是 macOS 和受支持的 iPadOS 版本中的主要命令界面。 在其中提供适用的应用命令;同时保留易于发现的界面和键盘替代方式,并遵循目标平台的惯例。

  5. 使用上下文菜单提供次要操作。 通过右键点击或长按唤出,且应与指针下方的项目相关。绝不要只在上下文菜单中提供某项命令。

  6. 使用弹出式按钮提供互斥选项。 从一组选项中恰好选择一项。

  7. 使用下拉按钮提供操作列表。 不设当前选项;提供一组命令供用户选择。

  8. 受支持的 iPhone/Apple Watch 机型上的硬件操作按钮可触发已配置的功能或 App Shortcuts。它不同于屏幕上的“更多”或操作菜单按钮。

  9. 使用展开控件实现渐进式披露。 显示或隐藏额外内容。

  10. **Dock 菜单应简短、聚焦,**仅包含应用运行时最实用的操作。

参考索引

参考资料主题核心内容
menus.md通用菜单设计项目排序、分组、快捷键
context-menus.md上下文菜单右键点击、长按、次要操作
dock-menus.mdDock 菜单macOS 应用级操作、运行状态
edit-menus.md编辑菜单撤销、复制、粘贴、标准项目
the-menu-bar.md菜单栏macOS 主要命令界面、结构
toolbars.md工具栏常用操作、自定义、位置
buttons.md按钮系统样式、尺寸、可操作性
action-button.md操作按钮分组次要操作、工具栏用途
pop-up-buttons.md弹出式按钮选择互斥选项
pull-down-buttons.md下拉按钮操作列表、不设当前选项
disclosure-controls.md展开控件渐进式披露、显示/隐藏

输出格式

  1. 组件建议 -- 推荐使用哪种菜单或按钮,以及原因。
  2. 视觉层级 -- 界面中的位置、尺寸和分组。
  3. 平台特定行为,涵盖 iOS、iPadOS、macOS、visionOS。
  4. 键盘快捷键(macOS)-- 菜单项和工具栏操作的标准及自定义快捷键。

要询问的问题

  1. 目标平台有哪些?
  2. 这是主要操作还是次要操作?
  3. 需要提供多少项操作?
  4. 是否为 macOS 菜单栏应用?

相关技能

  • hig-components-search -- 与工具栏和菜单搭配的搜索栏、页面控件
  • hig-components-controls -- 与按钮搭配的开关、选择器、分段控件
  • hig-components-dialogs -- 由菜单项或按钮触发的警告框、工作表、弹出框
  • hig-inputs -- 菜单和工具栏的键盘快捷键及指针交互

由 Raintree Technology 构建 · 更多开发者工具

何时使用

当需要执行概览中所述的工作流或操作时,可使用此技能。

示例

用户请求:

为 iPad 文档编辑器推荐易于访问的工具栏和溢出菜单命令,并提供 macOS 菜单栏对应项。

快照与实现边界

随附参考资料是经过本地审核修正的 Apple 文档快照;不对其是否为当前最新内容或 SDK 是否可用作任何声明。请在实际 UI 中验证目标 OS/SDK API、本地化、键盘/VoiceOver 行为、动态文本、焦点、点击区域,以及破坏性操作的恢复机制。破坏性角色会控制语义和样式,但不会自动实现确认、撤销或数据授权。远程图片/视频的说明文字已作为文本审核;其媒体未下载或检查。Apple 文档/媒体和 SF Symbols 仍受各自权利约束;仅提供署名并不能确立再分发权。

局限

  • 仅当任务明确符合上述范围时,才使用此技能。
  • 不要将输出视为环境特定验证、测试或专家审核的替代品。
  • 如果缺少必需的输入、权限、安全边界或成功标准,请停止并请求澄清。

评论

支持 Markdown