菜单
Map Figma colors and fonts from the data package into Swift via configurable JSON maps under .cursor/bindings/. Hit → emit mapped code snippet; miss → UIKit fallback. Use when generating color or font code from design.json.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Entry point for Figma → iOS UIKit/Swift code in this repo. Three-phase workflow: phase 1 runs figma-ios-preload-data to produce a unified data package; phase 2 (this playbook) consumes it via linked specialized skills (MK tokens, iOS 12, node conventions, SnapKit layout) to emit **baseline UI code** — visual/layout fidelity at 100%, data is mock, business logic stubbed behind `// TODO(阶段3): ...` markers. Phase 3 (PRD + API-doc rewrite into production code) is OUT OF SCOPE. Use when generating or refactoring Figma-based iOS UI, Figma to Swift, codegen, or when the user asks which skill applies.
从 Figma 节点自动识别选择交互模式（单选/多选/Toggle），生成选中态变化逻辑（更新数据模型 + 刷新 UI）， 集成 RxSwift 交互模式。Use when generating selection interaction code, or when user mentions 选中态交互、单选、多选、didSelectItem、Toggle。
Apply Figma comments that are pre-matched to nodes by figma-ios-preload-data. Read confidence + parsed tags from comments.json. Iconfont corrections are already written into design.json; color comments stay in comments.json for Phase-2 mapping. Use when generating code from Figma with designer comments.
从 figma-ios-preload-data 数据包（design.json）提取组件各状态的视觉特征（背景色、边框、文字颜色、字体）， 生成带 updateAppearance() 的状态切换代码。 Use when extracting visual states from Figma components, generating selected/unselected/disabled state code, or when user asks about 选中态、状态切换、updateAppearance。
Reference iOS image assets that figma-ios-preload-data pre-downloaded into the data package. Covers two cases: (1) local imagesets (copy + UIImage(named:)), and (2) server-side images (avatars / covers / category icons / any RECTANGLE filled with IMAGE that has no local imageset) — these MUST use the data package's mock.default_image_url via sd_setImage, never fabricated asset names. Use when wiring any UIImage reference or generating mock data for image fields.
识别 Figma 节点是否需要用 UICollectionView 实现。 通过 3 个条件（节点名称/子节点相似度/SYMBOL）判定， 返回识别结果供代码生成使用。 Use when analyzing Figma nodes to determine if they should be implemented as UICollectionView.
| name | figma-ios-design-token-mapping |
| description | Map Figma colors and fonts from the data package into Swift via configurable JSON maps under .cursor/bindings/. Hit → emit mapped code snippet; miss → UIKit fallback. Use when generating color or font code from design.json. |
权威配置：
.cursor/bindings/color_map.json、.cursor/bindings/font_map.json
示例包（MK）：.cursor/bindings/examples/mk/
说明：.cursor/bindings/README.md
本 skill 不写死任何设计系统类名；宿主 token 只活在映射 JSON 的 value 里。
Figma 颜色/字体
→ 查 bindings 对应 map
→ 命中：原样输出 map 里的代码片段
→ 未命中：用同文件 fallback 模板（标准 UIKit）
禁止：
design.json[node_id].fills[].color（已是 rgba(r,g,b,a) 字符串）。
TEXT 文字色也在 fills[].color（text 字段只是文案字符串，没有 text.color）。
评论色变更：comments.json 中 confidence>=medium 且含 color / color_correction 的评论优先于节点 fills（阶段 1 不把颜色写进 design.json，与 iconfont 回写不同）。
.cursor/bindings/color_map.jsonrgba(255,255,255,0.9)rgba(r,g,b,1) / rgba(r,g,b,0.9)（alpha=1 不写 .0）#FFFFFF 或带 alpha #FFFFFFE6255,255,255,0.9map[key]（本仓示例如 MKUIStyle.mk_c12()）fallback，替换占位符：| 占位符 | 含义 |
|---|---|
{r} {g} {b} | 0–255 整数 |
{a} | 0–1 透明度 |
默认 fallback：
UIColor(red: {r}/255.0, green: {g}/255.0, blue: {b}/255.0, alpha: {a})
{
"schema_version": "1.0.0",
"fallback": "UIColor(red: {r}/255.0, green: {g}/255.0, blue: {b}/255.0, alpha: {a})",
"map": {
"#FFFFFF": "MKUIStyle.mk_c12()",
"rgba(255,255,255,0.9)": "MKUIStyle.mk_c12_90()"
}
}
map 为空 = 全部走 UIKit（适合个人开发者）。
接入宿主色板：把「色值 → 一段 Swift 代码」写入 map，或从 examples/mk/ 复制后按需改。详见 bindings/README。
design.json[node_id].font（含 family / style 或 weight / size）与 text。
.cursor/bindings/font_map.jsonexamples/mk 的 font_map 一致）：{family},{Weight},{size}PingFang SC,Medium,14{family}|{Weight}|{size}map[key]（本仓示例如 MKUIStyle.mk_f14_m()）fallback：| 占位符 | 含义 |
|---|---|
{font_name} | PostScript 名（如 PingFangSC-Medium），无则用 family |
{size} | 字号 |
{family} {weight} | 原始字段 |
默认 fallback：
UIFont(name: "{font_name}", size: {size}) ?? UIFont.systemFont(ofSize: {size})
{
"schema_version": "1.0.0",
"fallback": "UIFont(name: \"{font_name}\", size: {size}) ?? UIFont.systemFont(ofSize: {size})",
"map": {
"PingFang SC,Medium,14": "MKUIStyle.mk_f14_m()"
}
}
| 场景 | 做法 |
|---|---|
| 个人 / 无设计系统 | 保持 map: {}，只用 fallback |
| 使用示例包 | cp .cursor/bindings/examples/mk/*.json .cursor/bindings/ 后按需改 |
| 自建设计系统 | 按「一个色值/字体 → 一段代码」填自己的 map |
旧路径 skills/figma-ios-design-token-mapping/legacy_*.json 仅作历史备份；阶段 2 只认 .cursor/bindings/。