无需自己写半行代码：让 AI 编程智能体（Agent）化身神笔马良为我们自动仿制 App 界面

概述

当列位秃头小码农们无意间瞥见一个 UI 美轮美奂的 App 时，是否有种深深“羡慕嫉妒恨”的感觉，“如果我能自己撸出这样美妙的界面就好了”，微秃码农们如是说。

你还真别说，借助于当今大红大紫的 AI 编程智能体（Agent）也许真的会让宝子们美梦成真呢？

想学会类似 Stable Diffusion（SD) 触及灵魂般“风格迁移”的绘画超能力吗？心动不如行动，让我们马上来探究一番吧！

Let’s go！！！😉

1. 照葫芦画瓢：一张原图

下图是从网上随机找到的一张 App 界面设计图片，我们想尝试一下众多号称自己“无敌是多么寂寞”的 Coding 智能体到底有没有像它们自己吹的那么厉害。

注意，我们希望 AI 用 SwiftUI 框架给出 iOS 上原生的 Swift 实现，并不是什么所谓的 html + css 概念代码。

2. 不太给力的 Trea

首先，来试一下 Trea。

不幸的是，Trea 好像没有读取和分析图片内容的能力，无论用什么模型都会给出如下错误提示：

一个红绿灯就搞的我们热血沸腾，实在让宝子们觉得有些失望。希望 Trea 能再接再厉早日加入分析图片的功能。

3. VSCode + qwen3-coder

虽然在 VSCode 中也不支持直接上传图片，但是作为变通，我们可以将对应的图片作为引用嵌入到提示词的输入界面中：

然后，选择号称撸码能力仅次于 claude 编程大模型的 qwen3-coder，妥善输入提示词来一窥究竟：

可以看到，qwen3-coder 生成的 SwiftUI 界面虽说与原图从布局上还有一定差距，但基本有模有样，而且视图中的标签卡片是可以实际滚动的。

更令人惊喜的是，qwen3-coder 生成的 SwiftUI 界面默认就很好的支持了暗色主题，非常 Nice！

4. Cursor + claude-4-sonneet

最后，我们来看看被无数秃头码农们捧上神坛的 Cursor，它在输入界面中可以非常方便的上传任意文件来辅助开发，图片自然也是不在话下：

用 Cursor 自然绝对少不了它的“好闺蜜”大模型 claude-4：

在输入完全一样的提示词后，小伙伴们简直不敢相信自己的眼睛：生成的 SwiftUI 界面几乎与原图一毛一样！

这可是正经八百 Swift 代码构建的哦：

但别高兴的太早，这里有一个问题：就是生成的 SwiftUI 界面无法滚动，而且底部标签栏中的元素也无法点击。

不过，我们只需再补充一句提示词给 AI 即可妥妥的解决：

此时，挑剔的宝子们如果将 iOS 设置为黑暗模式（Dark Mode）就会发现上面生成的视图界面却不会有任何变化。

检查 AI 生成的 SwiftUI 代码可以发现：这是因为 AI 太过纠结于完成我们的任务，以至于它将 UI 中所有前景、背景色以及其它元素都用固定颜色和风格限制死了。

幸运的是，通过简单的提示， claude 即可心领神会，灵巧的修复这一问题：

当然，小伙伴们还可以进一步通过提示词让 AI 完善我们的界面。但是，claude 从目前看来已经碾压一切了：要知道，这个还算复杂的 SwiftUI 视图我们还没有手动写过一行代码呢！

由此可见，未来撸码将会是一件多么惬意的事。

Cursor + claude “双剑合璧”组合就像是 SD 中对图片的风格迁移，下次当我们无意看到别人设计精妙绝伦的 App 界面时，我们就可以不费吹灰之力地将其收入囊中了，棒棒哒！💯

总结

在本篇博文中，我们比较了几种 AI IDE + 编程大模型对于 iOS 原生 SwiftUI 界面仿制能力的“孰是孰非”，宝子们可以任性选择哦！

感谢观赏，再会啦！😎