pixels2flutter.dev 🦋
将截图转换为Flutter代码!
工作原理
https://github.com/davidmigloz/pixels2flutter/assets/6546265/a6e4101c-98eb-4adf-b0b9-ae37af3f2ccc
1. 上传截图
选择或拖放你想转换为Flutter的UI截图。它可以来自真实的应用程序、设计甚至是手绘!
2. 额外指示
可以选择添加一些额外的指示,以帮助AI生成代码。例如,当用户与UI交互时,UI应该如何表现。
3. 代码生成
该应用利用OpenAI GPT-4o多模态LLM的强大功能,将你的截图和指示转换为Flutter代码。
4. 运行代码
生成的代码存储在GitHub Gist中,并加载到DartPad中。所以你可以直接在浏览器中运行生成的Flutter应用程序!
示例
截图 | |
线框图 | |
游戏 | |
鸣谢
该项目受到以下项目的启发:
许可
pixels2flutter.dev根据 AGPL-3.0 许可证 进行许可。