MikuMikuAR 文档

Appearance

菜单渲染引擎 ​

系统概览 ​

菜单渲染引擎（ADR-093 Schema 驱动）。将 MenuNode[] schema 渲染为实际的 DOM UI 控件， 支持 slider、toggle、dropdown、color 等多种控件类型，通过 bind 属性实现数据双向绑定。

核心职责 ​

  • render-menu.ts — Schema 到 DOM 的渲染转换、控件绑定、事件处理。

对外 API（节选） ​

  • interface MenuNode — 菜单节点定义（kind、label、control、bind 等）。
  • renderMenu(schema: MenuNode[], container: HTMLElement): () => void — 渲染菜单 schema，返回 dispose 函数。
  • 支持控件类型：folder / slider / colorSlider / toggle / modeSlider / modeRow / sectionTitle / action / divider / custom。

与其他子系统关系 ​

  • 被所有 *-levels.ts 调用。
  • 数据绑定：envState / uiState / sceneState。
  • Schema 类型：menu-schema.ts。

UI 入口 ​

  • 菜单层级 / 入口函数 / 快捷键统一由 menu-map.md 机器生成（勿手改）。
  • 运行时动态生成的菜单项（renderCustom / slideRow 等）无法静态提取，缺口由本卡正文说明。

不变量 ​

  • Schema 驱动渲染：所有 UI 由 MenuNode[] 定义，不硬编码 DOM。
  • bind 属性实现双向数据绑定，数据变化自动更新 UI，UI 变化自动更新数据。
  • 控件类型扩展：新增控件类型只需添加渲染分支。