随机抽奖小程序-抽奖摇号小程序 c语言

本案例中需要实现的功能是小程序可以实现摇一摇随机抽奖。 微信小程序没有提供可以摇一摇的API接口，但是提供了一个加速度数据事件wx.onAccelerometerChange(function callback)，可以用来模拟摇一摇功能

官网API developers.weixin.qq.com/miniprogram...

案例页面展示

具体效果是：摇一摇手机随机抽奖小程序，如果摇一摇成功，请求后台接口随机抽奖小程序，后台随机返回抽奖结果（中奖与否），抽奖次数减1，不同音效将播放。

注意：该功能的开发需要在真机的开发者工具中进行调试，在模拟器中无法正常运行

摇一摇实现代码，util/shake.js

let shakeInfo = {
  openFlag: false,  // 是否开启摇一摇，如果是小程序全局监听摇一摇，这里默认为true
  shakeSpeed: 110,  //设置阈值,越小越灵敏
  shakeStep: 2000,  //摇一摇成功后间隔
  lastTime: 0,  //此变量用来记录上次摇动的时间
  x: 0,
  y: 0,
  z: 0,
  lastX: 0,
  lastY: 0,
  lastZ: 0, //分别记录对应 x、y、z 三轴的数值和上次的数值
};

//开启摇一摇
function openShakeEvent() {
  shakeInfo.openFlag = true;
}
//关闭摇一摇
function closeShakeEvent() {
  shakeInfo.openFlag = false;
}
//摇一摇成功
function shakeOk() {
  closeShakeEvent();
}
/**
 * 判断是否为摇一摇
 */
function shake(acceleration, successCallback) {
  if (!shakeInfo.openFlag) {

    return;
  }
  var nowTime = new Date().getTime(); //记录当前时间
  //如果这次摇的时间距离上次摇的时间有一定间隔 才执行
  if (nowTime - shakeInfo.lastTime > 100) {
    var diffTime = nowTime - shakeInfo.lastTime; //记录时间段
    shakeInfo.lastTime = nowTime; //记录本次摇动时间
    shakeInfo.x = acceleration.x; //获取 x 轴数值
    shakeInfo.y = acceleration.y; //获取 y 轴数值
    shakeInfo.z = acceleration.z; //获取 z 轴数值
    //计算摇一摇的速度
    var speed = Math.abs(shakeInfo.x + shakeInfo.y + shakeInfo.z - shakeInfo.lastX - shakeInfo.lastY - shakeInfo.lastZ) / diffTime * 10000;
    if (speed > shakeInfo.shakeSpeed) { //如果计算出来的摇一摇幅度足够大，那么认为用户摇一摇成功
      successCallback();
    }
    //赋值，为下一次计算做准备
    shakeInfo.lastX = shakeInfo.x;
    shakeInfo.lastY = shakeInfo.y;
    shakeInfo.lastZ = shakeInfo.z; 
  }

}
module.exports = {
  openShakeEvent: openShakeEvent,
  closeShakeEvent: closeShakeEvent,
  shake: shake,
  shakeOk: shakeOk
}
复制代码

shake方法调用shake/shake.js

// pages/shake/shake.js
const app = getApp()
const shake = require('../../utils/shake.js');
Page({}
  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    shake.openShakeEvent();  //打开摇一摇功能

    this.onAccelerometerChange()  //开启摇一摇
  },
  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
    wx.offAccelerometerChange()  //取消监听加速度数据事件,如果没有取消监听，退出页面后摇一摇事件会继续执行
    shake.closeShakeEvent()  //关闭摇一摇功能
  },
  // 开启摇一摇
  onAccelerometerChange() {
    let _this = this
    wx.onAccelerometerChange(function(acceleration) {
      shake.shake(acceleration, function() {
        // 摇一摇成功后执行代码
        _this.playSound('/static/audio/shake.wav') // 播放摇一摇音频
        shake.shakeOk();
        //摇一摇成功后调用后台接口获取中奖信息

        ......
        ......
        ......
      });
    });
  },
  //播放音频
  playSound = (src) => {
    const innerAudioContext = wx.createInnerAudioContext()
    innerAudioContext.autoplay = true
    //这两句话话一定要在一起，不然ios手机上会有时间放不出声音
    innerAudioContext.src = src
    innerAudioContext.onPlay(() => {
        console.log('开始播放')
    })
    innerAudioContext.onError((res) => {
        console.log(res)
    })
  }
)
复制代码