swiftui codegen expert

SwiftUI Codegen Expert 是一个 AI 驱动的 SwiftUI 代码生成技能，核心目标是把设计稿、截图和文字描述转换为 SwiftUI 代码。

用途 该技能面向需要将视觉设计快速落地为 SwiftUI 代码的开发者。它支持从任意 UI 截图生成代码，也支持根据文字描述（如 Figma 设计说明）生成视图，并能结合项目已有的设计系统与代码模式进行输出。

主要能力

1. 截图转 SwiftUI：对任意 UI 截图，配合上下文发送给 Claude，生成可用于生产的 SwiftUI 代码。
2. 分析现有 UI：针对应用截图，分析布局层级、间距模式、颜色使用和字体排版，并给出最适合复现该界面的 SwiftUI 组件建议。
3. 设计系统提取：从截图中提取颜色调色板（以 SwiftUI Color 扩展形式）、字体样式（以 ViewModifier 形式）、间距数值（以常量形式）以及组件模式。
4. 代码生成模式：可根据描述生成具体组件，例如带图片、标题、副标题、圆角和阴影的卡片视图；也可生成响应式布局，例如在 iPhone 上两列、iPad 上三列的网格。
5. 与 Stitch MCP 集成：可基于 Stitch 设计（如 project/screen/123）生成遵循代码库模式的 SwiftUI 代码，复用已有的 Theme.swift、Typography.swift 和 Components/ 中的可复用视图。

使用方式 典型工作流为：截取任意 UI 的截图，附加上下文发送给 Claude，获得生产级 SwiftUI 代码。示例提示词包括：提供一张登录界面截图，要求生成匹配该设计的 SwiftUI 代码，并使用已有的 ColorPalette、Typography 样式，同时适配 AuthViewModel。

最佳实践

1. 提供上下文：说明代码库使用的模式，例如使用 @Observable 管理状态、使用 NavigationStack（而非 NavigationView）、使用 ViewModifier 实现可复用样式、使用 Preview 宏，并要求生成符合这些模式的代码。
2. 组件提取：当生成的视图过大时，要求提取可复用组件（如 HeaderView、ContentSection、ActionButton），并作为私有视图保留在同一文件中。
3. 无障碍：为生成的代码添加 VoiceOver 标签、动态字体支持、减弱动态效果支持和语义分组。

迭代工作流

1. 从截图生成初始代码；2. 在 Xcode 中预览；3. 对预览截图；4. 反馈差异（如“间距不对”）；5. 获得优化后的代码；6. 重复直至满意。

配套工具

• Sosumi MCP：生成前查询 Apple 文档，确认该组件类型的最新 SwiftUI API、平台可用性和推荐模式。
• Xcode Previews：通过 #Preview 宏预览生成的组件，例如预览 ContentCard 组件。

适用场景 将设计转换为代码、迭代 UI、学习 SwiftUI 模式。

限制 关于该技能的收费、价格、平台支持范围等具体信息，资料中暂未提供。