用途:把移动端 UI 布局(Stitch 生成的 deviceType: MOBILE 界面、本地 HTML 文件或 URL)转换为可在 Xcode 中构建运行的原生 iOS SwiftUI 视图。目标为 iOS 16+,需 Xcode 15+、Swift 5.9+;跨平台需求建议改用 stitch-react-native-components。
主要能力:将 HTML/CSS 的 flex 布局映射为 VStack/HStack/ZStack,grid 映射为 LazyVGrid,绝对定位映射为 ZStack;把文字、按钮、输入框、选择器、开关映射到对应 SwiftUI 组件;生成 Xcode 工程目录结构(Theme、Views、Components、Models、Assets.xcassets);从 Tailwind 配置、CSS 变量或样式表提取颜色与圆角、间距令牌,并给出浅色/深色配色;附带无障碍标签与动态字体、弹簧动画、减少动态效果等实践。
使用方式:先把源内容解析为 temp/source.html——Stitch 屏幕用 MCP 的 get_screen 获取设计 JSON,再用 bash scripts/fetch-stitch.sh "[htmlCode.downloadUrl]" "temp/source.html" 下载;本地文件用 mkdir -p temp && cp "path/to/design.html" temp/source.html;URL 用 bash scripts/fetch-stitch.sh "https://example.com/page" "temp/source.html"。随后在 Xcode 新建 App 工程,依次创建数据层、主题令牌与颜色扩展,逐屏转换组件、接入 TabView 或 NavigationStack,最后 Cmd+R 构建运行并在深浅色下验证。
适用场景:已有移动端设计稿、希望产出原生 iOS 代码的场景;本地 HTML 或 URL 路径无需 Google 账号,仅 Stitch 路径需要 API 密钥。
限制:仅适用于移动布局,桌面布局需大幅重构;截图无上传通道,需用文本提示重新生成或手写 HTML;URL 路径只下载单个 HTML 响应,外链样式表可能缺失,令牌无法解析时应明确说明而非编造配色。