pixels2flutter.dev ?
将截图转换为 Flutter 代码!
它是如何工作的
pixels2flutter.mp4
1. 上传截图
选择或拖放您要转换为 Flutter 的 UI 截图。它可以是真实应用、设计稿,甚至是手绘图!
2. 其他说明
您可以选择添加一些额外的指令来帮助 AI 生成代码。例如,当用户与 UI 交互时,UI 应如何响应。
3. 代码生成
该应用利用 OpenAI GPT-4V(ision) 多模态 LLM 的强大功能,将您的截图和说明转换为代码。
4. 运行代码
生成的代码存储在 GitHub Gist 中,并加载到 DartPad 中。这样您就可以直接在浏览器中运行生成的 Flutter 应用!
示例
截图 将真实应用的截图转换为 Flutter 代码。 |
|
线框图 将线框图转换为 Flutter 代码。 |
|
游戏 将游戏截图加上其逻辑描述转换为可玩的 Flutter 游戏。 |
|
致谢
该项目受到以下项目的启发
许可证
pixels2flutter.dev 在 AGPL-3.0 许可下授权使用。AGPL-3.0 许可证。





