乐于分享
好东西不私藏

零基础,使用 AI 完成在线电子木鱼娱乐工具,开发教程

零基础,使用 AI 完成在线电子木鱼娱乐工具,开发教程
使用 Trae工具制作一个在线的电子木鱼工具,首先输入开发需求,可以参考中下提示词。

为我开发一个禅意电子木鱼网页工具,具体要求如下:

1. 使用 HTML5 实现,所有功能代码必须整合在单个 HTML 文件中

2. 实现一个禅意电子木鱼在线工具:

- 主要实现点击/触摸木鱼动作,敲击时需要显示漂浮功德 +1 文字和随机禅语祝福显示。

- 添加功德累积计数、木鱼音效。

- 需求适配移动端设备。

打开 Trae 工具,在对话框中生成对应的,生成完成后,运行 html 文件可以看到初版的效果。
这里遇到一个问题,绘制出来的木鱼如下图,与实际的木鱼差别很大。
具体的解决方法是到矢量图网站,找到对应的木鱼图标,复制 svg 内容并添加到此工具中。
使用的是阿里巴巴矢量图标库,操作如下图,
复制 SVG 代码后,在对话框中木鱼图标使用此代码图标,内容如下。
更换完成后,修复木槌敲击木鱼的问题,最终的效果如下,

感兴趣的小伙伴,可以动手制作属于你的专属网页,拼豆小工具网页链接,点击【阅读原文】跳转

历史文章的所有工具链接,可在菜单栏中“工具集”中获取使用!

小程序推广

个人开发的图片拼接小程序,欢迎使用,有更好的建议,留言区留言。