当前位置：首页 > news >正文

重庆汽车网站建设跨境电商有哪些平台

news 2025/8/23 9:17:08

重庆汽车网站建设,跨境电商有哪些平台,广东微信网站制作报价,东莞微联建站突发奇想,做个录音的模块,结果折腾到一点钟,还在做话筒的动画. 最后发现微信还有bug,我也是醉了.有空再接着敲. 先上gif: 这还没完成,做完之后应该是水波纹的样子.无奈函数执行多次,动画只执行一次.还是先把锅甩出去. 上微信开发文档的图: 代码先贴上: 1.index.wxml [html] vie…

突发奇想,做个录音的模块,结果折腾到一点钟,还在做话筒的动画.

最后发现微信还有bug,我也是醉了.有空再接着敲.

先上gif:

这还没完成,做完之后应该是水波纹的样子.无奈函数执行多次,动画只执行一次.还是先把锅甩出去.

上微信开发文档的图:

代码先贴上:

1.index.wxml

[html] view plaincopy  
 <!--index.wxml-->  
 <view  class="voice-style" bindtap="startSpeak">  
 <image class="bg-style" src="../../images/voice_icon_speaking_bg_normal.png"></image>  
 <image class="bg-style" animation="{{spreakingAnimation}}" src="../../images/voice_video_loading_0.png"></image>  
 <image class="sound-style" src="../../images/voice_icon_speech_sound_1.png"></image>  
 <image class="sound-style" src="../../images/voice_icon_speech_sound_2.png"></image>  
 <image class="sound-style" src="../../images/voice_icon_speech_sound_3.png"></image>  
 <image class="sound-style" src="../../images/voice_icon_speech_sound_4.png"></image>  
 <image class="sound-style" src="../../images/voice_icon_speech_sound_5.png"></image>  
 </view>  

2.index.wxss

[css] view plaincopy  
 /**index.wxss**/  
 .voice-style {  
   margin-top: 400px;  
   display: flex;  
   position: relative;  
   flex-direction: column;  
   align-items: center;  
 }  
   
 .bg-style {  
   position: absolute;  
   width: 100px;  
   height: 100px;  
 }  
 .sound-style{  
   position: absolute;  
   width: 37.6px;  
   height: 60px;  
   margin-top: 20px;  
 }  

3.index.js

[javascript] view plaincopy  
 //index.js  
 //获取应用实例  
 var app = getApp()  
 Page({  
   data: {  
     spreakingAnimation: {},//放大动画  
   },  
   onLoad: function () {  
   },  
   //点击开始说话  
   startSpeak: function () {  
     var _this = this;  
     var timer = setInterval(function () {  
       console.log("开始说话.....")  
       speaking.call(_this);  
     }, 200);  
   },  
 })  
 function speaking() {  
   console.log("动画.....")  
   var _this = this;  
   var animation = wx.createAnimation({  
     duration: 1000,  
   })  
   animation.opacity(0).scale(3, 3).step();//修改透明度,放大  
   this.setData({  
     spreakingAnimation: animation.export()  
   })  
 }  