137-3385-8848(同微信)

摇一摇小程序系统开发

2022-04-21 管理员
我们知道微信摇一摇这个功能,但是如果开发一个摇一摇小程序,要怎么做呢?

 //首先定义一下,全局变量
   var lastTime = 0;//此变量用来记录上次摇动的时间
   var x=0,
       y = 0,
       z=0,
       lastX =0,
       lastY = 0,
       lastZ = 0;//此组变量分别记录对应x、y、z三轴的数值和上次的数值
   var shakeSpeed = 110;//设置阈值
   //编写摇一摇方法
   function shake(acceleration) {
     var nowTime = new Date().getTime();//记录当前时间
     //如果这次摇的时间距离上次摇的时间有一定间隔 才执行
     if (nowTime - lastTime > 100) {
       var diffTime = nowTime - lastTime;//记录时间段
       lastTime = nowTime;//记录本次摇动时间,为下次计算摇动时间做准备
       x = acceleration.x;//获取x轴数值,x轴为垂直于北轴,向东为正
       y = acceleration.y;//获取y轴数值,y轴向正北为正
       z = acceleration.z;//获取z轴数值,z轴垂直于地面,向上为正
       //计算 公式的意思是 单位时间内运动的路程,即为我们想要的速度
       var speed = Math.abs(x + y + z - lastX - lastY - lastZ) / diffTime * 10000;
       //console.log(speed)
       if (speed > shakeSpeed) {//如果计算出来的速度超过了阈值,那么就算作用户成功摇一摇
 
         wx.stopAccelerometer()
 
         self.setData({
           hasInit: false,
           canvas:{}
         })
         audioCtx.setSrc('http://123.207.0.183/application/images/s.mp3')
         audioCtx.play()
         wx.showLoading({
           title: '寻找大神中...'
         })
         config.request({
           // 要请求的地址
           url: config.service.taRan,
           success(e) {
             setTimeout(function(){
               //console.log(e.data)
               audioCtx.setSrc('http://123.207.0.183/application/images/r.mp3')
               audioCtx.play()
               self.uid = e.data
               self.con = ''
               self.onInitShow()
 
             },2000)
 
           }
         })
       }
       lastX = x;//赋值,为下一次计算做准备
       lastY = y;//赋值,为下一次计算做准备
       lastZ = z;//赋值,为下一次计算做准备
     }
   }
   wx.onAccelerometerChange(shake)
   //wx.startAccelerometer()
   var audioCtx = wx.createAudioContext('myAudio')
提醒:audio API的src不能用本地地址。


小程序工具提供多类型商城/门店小程序制作,可视化编辑 1秒生成5步上线。通过拖拽、拼接模块布局小程序商城页面,所看即所得,只需要美工就能做出精美商城。

更多微信小程序相关资讯,请前往:https://www.kesion.com/miniprogramschool/


上一篇:小程序关键词哪里设置,小程序关键词在哪设置
下一篇:微信小程序多次跳转的情况怎么避免
相关资讯 Releva ntnews
解决方案 Solutions
相关热点 Hot spot
郑州做排名中正确使用关键词优化的方法
  1. 我们的优势
  2. 我们的实力
  3. 选择我们的理由
咨询电话(微信同号)

137-3385-8848(同微信)

豫ICP备16014343号-1

Copyright © 2017-2022 版权所有 酷微科技 Rights Reserved

电话咨询 在线咨询 服务项目 SEO优化