微信小程序摇一摇

方法定义: 

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();
    setTimeout(function () {
        openShakeEvent();
    }, shakeInfo.shakeStep);
}
/**
 * 判断是否为摇一摇
 */
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 轴数值,x 轴为垂直于北轴,向东为正
        shakeInfo.y = acceleration.y; //获取 y 轴数值,y 轴向正北为正
        shakeInfo.z = acceleration.z; //获取 z 轴数值,z 轴垂直于地面,向上为正
        //计算 公式的意思是 单位时间内运动的路程,即为我们想要的速度
        var speed = Math.abs(shakeInfo.x + shakeInfo.y + shakeInfo.z - shakeInfo.lastX - shakeInfo.lastY - shakeInfo.lastZ) / diffTime * 10000;
        //console.log(speed)
        if (speed > shakeInfo.shakeSpeed) { //如果计算出来的速度超过了阈值,那么就算作用户成功摇一摇
            successCallback();
        }
        shakeInfo.lastX = shakeInfo.x; //赋值,为下一次计算做准备
        shakeInfo.lastY = shakeInfo.y; //赋值,为下一次计算做准备
        shakeInfo.lastZ = shakeInfo.z; //赋值,为下一次计算做准备
    }
}

方法调用,在小程序启动首页页面onLoad添加如下代码:

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function(options) {
        //
        wx.onAccelerometerChange(function(acceleration) {
            Main.shake(acceleration, function() {
                Main.shakeOk();
                Main.openBarCodeDlg(); // 在这里调用摇一摇成功后执行的代码
            });
        });
    }

如果是小程序全局都监听摇一摇,以上代码就可以实现,如果只是配置指定某几个页面监听,则需要在监听的页面做以下code:

onShow: function() {
    Main.openShakeEvent();
},
onHide: function() {
    Main.closeShakeEvent();
}

这样在跳转到非监听页面时就不会执行你的代码了

  • 5
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值