商城系統(tǒng) 注冊(cè)

搖一搖小程序系統(tǒng)開發(fā)

2018-02-09|HiShop
導(dǎo)讀:我們知道微信搖一搖這個(gè)功能,但是如果開發(fā)一個(gè)搖一搖小程序,要怎么做呢? ...
我們知道微信搖一搖這個(gè)功能,但是如果開發(fā)一個(gè)搖一搖小程序,要怎么做呢?

 //首先定義一下,全局變量
   var lastTime = 0;//此變量用來記錄上次搖動(dòng)的時(shí)間
   var x=0,
       y = 0,
       z=0,
       lastX =0,
       lastY = 0,
       lastZ = 0;//此組變量分別記錄對(duì)應(yīng)x、y、z三軸的數(shù)值和上次的數(shù)值
   var shakeSpeed = 110;//設(shè)置閾值
   //編寫搖一搖方法
   function shake(acceleration) {
     var nowTime = new Date().getTime();//記錄當(dāng)前時(shí)間
     //如果這次搖的時(shí)間距離上次搖的時(shí)間有一定間隔 才執(zhí)行
     if (nowTime - lastTime > 100) {
       var diffTime = nowTime - lastTime;//記錄時(shí)間段
       lastTime = nowTime;//記錄本次搖動(dòng)時(shí)間,為下次計(jì)算搖動(dòng)時(shí)間做準(zhǔn)備
       x = acceleration.x;//獲取x軸數(shù)值,x軸為垂直于北軸,向東為正
       y = acceleration.y;//獲取y軸數(shù)值,y軸向正北為正
       z = acceleration.z;//獲取z軸數(shù)值,z軸垂直于地面,向上為正
       //計(jì)算 公式的意思是 單位時(shí)間內(nèi)運(yùn)動(dòng)的路程,即為我們想要的速度
       var speed = Math.abs(x + y + z - lastX - lastY - lastZ) / diffTime * 10000;
       //console.log(speed)
       if (speed > shakeSpeed) {//如果計(jì)算出來的速度超過了閾值,那么就算作用戶成功搖一搖
 
         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({
           // 要請(qǐng)求的地址
           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;//賦值,為下一次計(jì)算做準(zhǔn)備
       lastY = y;//賦值,為下一次計(jì)算做準(zhǔn)備
       lastZ = z;//賦值,為下一次計(jì)算做準(zhǔn)備
     }
   }
   wx.onAccelerometerChange(shake)
   //wx.startAccelerometer()
   var audioCtx = wx.createAudioContext('myAudio')
提醒:audio API的src不能用本地地址。


HiShop小程序工具提供多類型商城/門店小程序制作,可視化編輯 1秒生成5步上線。通過拖拽、拼接模塊布局小程序商城頁面,所看即所得,只需要美工就能做出精美商城。

更多小程序資訊,盡在:zytcm.com.cn/xiaocx/


電話咨詢 預(yù)約演示 0元開店