figma-ios-codegen

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。

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.

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.

从 figma-ios-preload-data 数据包（design.json）识别标准 UI 组件类型（Selector、Stepper、Toggle、Tag Group 等）， 提取布局模式和通用特征，指导后续状态提取和代码生成。 Use when identifying component type from Figma, or when user mentions Selector、Stepper、Toggle、标准组件、通用组件、组件类型识别。

Conventions for turning a figma-ios-preload-data data package (design.json) into app UI (UIKit): which nodes to skip, how to treat design-only chrome (Home Indicator / Status Bar / Device Frame / 设计标注). Use when implementing Figma designs from the data package, or when the user asks for Figma-to-code skip rules.

根据 Figma 节点数据生成完整的 UICollectionView Swift 代码。 包括：分析 Cell 子元素 → 推断模型字段 → 生成 Mock 数据 → 生成 CollectionView/Cell 代码 → 生成交互逻辑（选中态/日志）。 Use when generating UICollectionView code from Figma designs.

规定哪些 Figma 矢量图形应该下载为图片 Assets，哪些应该用 iOS 代码绘制。 避免不必要的图片下载，减少包体积。 Use when generating code from Figma designs with vector graphics, shapes, or masks.

Quality bar for the **phase-2 baseline UI code** produced by this repo's Figma-to-UIKit/Swift workflow (not phase-3 production code, which is out of scope here). Covers: acceptance checklist, forbidden shortcuts, the UI-node-coverage audit, and when human input is still required. The "commercial" in the name refers to the phase-2 quality floor ("no shortcuts / no fabricated content / no missing nodes"), not to final production-ready business code — production code is produced in phase 3 by combining this baseline with PRD + API docs. Use when generating or reviewing the phase-2 Figma-based iOS UI output.

Map iconfont nodes from design.json[node].iconfont into Swift via .cursor/bindings/iconfont_map.json. Hit → emit mapped font/text snippets; miss → fallback + TODO. Use when generating icon/button code from iconfont nodes.

Identify Figma navigation-bar nodes and generate UIKit navigation code using .cursor/bindings/host.json (bases, custom nav class, utils). Use when generating navigation bar / ViewController base class code from Figma.

Phase 4 visual fidelity check. Read the pre-fetched screenshot.png in the data package, compare it visually against generated code, and emit a difference report. Use after iOS code generation to confirm visual fidelity.

Generated Swift and Objective-C UI code must run on iOS 12.0+. Avoid APIs introduced in iOS 13+ unless wrapped in availability checks. Use when the user mentions iOS 12, minimum deployment, SF Symbols, darkContent status bar, or CALayerCornerCurve.

Handles vertical layout rules and safe-area insets when generating UIKit code from Figma designs. Covers: iPhone X vs iPhone 8 form factor detection, Status Bar height, Home Indicator skip rule, sticky-top/sticky-bottom views, and why vertical values must never be scaled by screenWidth ratio. Use when generating vertical constraints, handling safe area or safeAreaLayoutGuide, or when the user mentions 吸顶、吸底、Safe Area、Status Bar 高度、Home Indicator、 safeAreaLayoutGuide、垂直 scale 禁止。

When turning Figma designs into iOS UIKit/Swift, prefers relative Auto Layout over absolute frames and uses SnapKit for constraints. Use when generating or refactoring Figma-based views, layout code, constraints, or when the user mentions SnapKit, relative layout, or avoiding fixed frames from Figma.

项目中使用 RxSwift + RxCocoa 处理 UI 交互事件（按钮点击、手势等）的标准模式。 Use when generating UI interaction code, button actions, or when user mentions RxSwift、RxCocoa、响应式。

从 Figma 固定宽度设计稿（375pt）生成横向自适应的 iOS 布局代码。 根据容器左右间隙判断布局策略：对称布局/接近全宽布局使用动态宽度，其他使用固定宽度。 子元素根据容器特征选择比例缩放或列表布局。 Use when generating ANY horizontal layout from Figma.

Maps Figma node hierarchy (FRAME/GROUP/INSTANCE) to UIKit UIView containers, preserving parent-child relationships, addSubview order, and coordinate system. Decides which nodes become UIView containers vs leaf views, and how to read relative/absolute coordinates from the data package. Use when generating UIKit code from a Figma data package, or when the user mentions 层级保持、拍平、 addSubview 顺序、坐标系转换、relative frame、frame.relative。

Translate Figma Variables multi-mode warnings (already detected by figma-ios-preload-data) into top-of-file Swift comments so dark mode is not silently dropped. Use when generating Swift code from a data package whose summary.has_dark_mode is true.