百度智能小程序 开始监听加速度数据

2020-09-05 14:29 更新

swan.startAccelerometer

解释:开始监听加速度数据。

Web 态说明:由于浏览器对于 W3C 规范的实现差异,startAccelerometer 功能在部分浏览器(比如 Safari 浏览器)下不可用,在功能不可用情况下会执行开发者设置的 fail 回调。

方法参数

Object object

object 参数说明

属性名类型必填默认值说明

interval

String

normal

监听加速度数据回调函数的执行频率

success

Function

接口调用成功的回调函数

fail

Function

接口调用失败的回调函数

complete

Function

接口调用结束的回调函数(调用成功、失败都会执行)

interval 的有效值

根据机型性能、当前 CPU 与内存的占用情况,interval 的设置与实际 swan.onAccelerometerChange() 回调函数的执行频率会有一些出入。

说明

game

适用于更新游戏的回调频率,在 20ms/次 左右

ui

适用于更新 UI 的回调频率,在 60ms/次 左右

normal

普通的回调频率,在 200ms/次 左右

示例 

在开发者工具中打开


图片示例

代码示例

<view class="wrap">
    <view class="page-top">
        <view class="page-top-text">{{title}}</view>
        <view class="page-top-line"></view>
    </view>
    <view class="page-body-canvas">
        <image mode="aspectFit" src="https://b.bdstatic.com/searchbox/icms/searchbox/img/gravity.png" rel="external nofollow"  class="page-body-ball"></image>
        <canvas class="page-body-ball" show="{{true}}" canvas-id="small-ball"></canvas>
    </view>
    <view class="page-body-xyz">
        <text class="page-body-title">X: {{x}}</text>
        <text class="page-body-title">Y: {{y}}</text>
        <text class="page-body-title">Z: {{z}}</text>
    </view>
    <view class="page-body-btn">
        <view class="middle-btn {{!isWatch ? '' : 'disabled'}}" bind:tap="startWatch">开始监听</view>
        <view class="middle-btn {{!isWatch ? 'disabled' : ''}}" bind:tap="stopWatch">停止监听</view >
    </view>
</view>
Page({
    data: {
        title: '倾斜手机即可移动下方小球',
        isWatch: true,
        x: 0,
        y: 0,
        z: 0
    },

    onReady() {
        this.position = {
            x: 151,
            y: 151,
            vx: 0,
            vy: 0,
            ax: 0,
            ay: 0
        };
        swan.onAccelerometerChange(res => {
            this.setData({
                x: res.x.toFixed(2),
                y: res.y.toFixed(2),
                z: res.z.toFixed(2)
            });
            this.position.ax = Math.sin(res.x * Math.PI / 2);
            this.position.ay = -Math.sin(res.y * Math.PI / 2);
        });
        this.interval = setInterval(() => {
            this.drawSmallBall();
        }, 20);
    },
    onShow() {
        let isWatch = this.data.isWatch;
        isWatch 
        ? swan.startAccelerometer()
        : swan.stopAccelerometer();
    },
    drawSmallBall() {
        let p = this.position;
        p.x = p.x + p.vx;
        p.y = p.y + p.vy;
        p.vx = p.vx + p.ax;
        p.vy = p.vy + p.ay;

        if (Math.sqrt(Math.pow(Math.abs(p.x) - 151, 2) + Math.pow(Math.abs(p.y) - 151, 2)) >= 115) {
            if (p.x > 151 && p.vx > 0) {
                p.vx = 0;
            }
            if (p.x < 151 && p.vx < 0) {
                p.vx = 0;
            }
            if (p.y > 151 && p.vy > 0) {
                p.vy = 0;
            }
            if (p.y < 151 && p.vy < 0) {
                p.vy = 0;
            }
        }
        let stx = this.createCanvasContext('small-ball');
        stx.beginPath(0);
        stx.arc(p.x, p.y, 15, 0, Math.PI * 2);
        stx.setFillStyle('#3388FF');
        stx.fill();
        stx.draw();
    },
    startWatch() {
        this.setData('isWatch', true);
        swan.startAccelerometer();
    },
    stopWatch() {
        this.setData('isWatch', false);
        swan.stopAccelerometer();
    },
    onHide() {
        clearInterval(this.interval);
        app.globalData.openParams = '';
    },
    onUnload() {
        clearInterval(this.interval);
    }
});


以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号