uniapp实现功德木鱼
2023-09-11 本文已影响0人
凯瑟鸭
最近待在家里也看不进去书,突发奇想的写点东西,就写了这个功德木鱼,实现的原理很简单,界面设计太麻烦了所以就没有设计,比较简单。如下
![](https://img.haomeiwen.com/i22114649/a469d21148726614.png)
实现原理具体如下:
1、就是在进入界面的时候使用uni.createInnerAudioContext()创建音频对象,设置自动播放背景音乐
![](https://img.haomeiwen.com/i22114649/a5bfd2a4fc23d721.png)
2、在界面上放置木鱼图片并增添相应的点击事件,在点击时修改图片的放缩样式达到敲击木鱼的效果,同时记录count加一,并在此时显示文本设置动画,让其opacity由1变成0即可。
![](https://img.haomeiwen.com/i22114649/1701d9586d119f91.png)
![](https://img.haomeiwen.com/i22114649/47e1101c41c48b3c.png)
体验地址:
![](https://img.haomeiwen.com/i22114649/a9a3483709f9fe93.jpg)
若有不对之处还希望指正为谢!@~@