uniapp-微信摇一摇功能开发

作者: gavin 分类: uniapp 发布时间: 2022-02-09 09:14

uniapp通过设备的“加速度计“功能来实现:

https://uniapp.dcloud.net.cn/api/system/accelerometer

微信参考:

https://developers.weixin.qq.com/community/develop/doc/000066be5d0d70228588c7b3c5b800

【代码部分】

在methods里加入方法

/**
			     * 摇一摇抽奖
			     */
			    yaoyiyao: function () {
			        let that = this;
			        // 开始监听摇一摇事件
			        wx.startAccelerometer({
			            interval: 'normal',
			            success: (res) => {
			                wx.onAccelerometerChange(function (res) {
			                    console.log(res.x);
			                    console.log(Math.abs(res.x));
			                    // 手机进行了摇一摇
			                    if (Math.abs(res.x) > .7 && Math.abs(res.y) > .7) {
			                        console.log('摇一摇成功');
			                        // 停止监听
			                        wx.stopAccelerometer({
			                            success: () => {
			                                console.log('停止监听摇一摇');
			                                // 震动提示
			                                wx.vibrateLong({
			                                    success(res) {
													that.random();
			                                        // 播放提示音
			                                        const innerAudioContext = wx.createInnerAudioContext();
			                                        innerAudioContext.autoplay = true;
			                                        innerAudioContext.src = that.yaoAudio;
			                                        innerAudioContext.onPlay(() => {
			                                            console.log('开始播放');
			                                        });
			                                        innerAudioContext.onError((res) => {
			                                            // console.log(res.errMsg);
			                                            // console.log(res.errCode);
			                                        });
			                                    }
			                                });
			                            }
			                        });
			                    };
			                });
			            }
			        })
			    }

在onShow里和需要重新摇一摇的button上调用方法

this.yaoyiyao();

在data()里设置播放音频

yaoAudio:”https://dkdkdk.com/static/r.mp3″