92 lines
4.9 KiB
Markdown
92 lines
4.9 KiB
Markdown
---
|
|
title: egret 获取设备陀螺仪信息以及运动状态信息
|
|
id: '217'
|
|
categories:
|
|
- 分享
|
|
tags:
|
|
- egret
|
|
- 陀螺仪
|
|
- DeviceOrientation
|
|
- Motion
|
|
date: 2017-11-22 15:55:55
|
|
---
|
|
|
|
在最新版本的egret（5.0.12）中，已经支持了移动设备陀螺仪和运动状态的相关API。 **egret. DeviceOrientation** 可以监听设备方向的变化。 **egret. Motion**从用户设备读取运动状态信息并派发 CHANGE 事件。当设备移动时，传感器会检测到此移动并返回设备加速度，重力和旋转数据。 废话不多说，直接上代码：
|
|
|
|
```
|
|
|
|
class Main extends egret.DisplayObjectContainer {
|
|
|
|
private orientationLabel: egret.TextField;
|
|
|
|
private motionLabel: egret.TextField;
|
|
|
|
public constructor() {
|
|
super();
|
|
|
|
this.orientationLabel = new egret.TextField();
|
|
this.orientationLabel.width = 640;
|
|
this.orientationLabel.textAlign = egret.HorizontalAlign.CENTER;
|
|
this.addChild(this.orientationLabel);
|
|
|
|
this.motionLabel = new egret.TextField();
|
|
this.motionLabel.width = 640;
|
|
this.motionLabel.y = 300;
|
|
this.motionLabel.textAlign = egret.HorizontalAlign.CENTER;
|
|
this.addChild(this.motionLabel);
|
|
|
|
//创建 DeviceOrientation 类
|
|
var orientation = new egret.DeviceOrientation();
|
|
//添加事件监听器
|
|
orientation.addEventListener(egret.Event.CHANGE,this.onOrientation,this);
|
|
//开始监听设备方向变化
|
|
orientation.start();
|
|
|
|
//创建 Motion 类
|
|
var motion = new egret.Motion();
|
|
//添加事件监听器
|
|
motion.addEventListener(egret.Event.CHANGE,this.onMotion,this);
|
|
//开始监听设备方向变化
|
|
motion.start();
|
|
}
|
|
|
|
private onOrientation(e:egret.OrientationEvent){
|
|
this.orientationLabel.textFlow = >[
|
|
{text: "绕 Z 轴的角度:\n"}
|
|
, {text: e.alpha, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\n绕 X 轴的角度:\n"}
|
|
, {text: e.beta, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\n绕 Y 轴的角度:\n"}
|
|
, {text: e.gamma, style: {"textColor": 0xff0000}}
|
|
];
|
|
}
|
|
|
|
private onMotion(e:egret.MotionEvent){
|
|
this.motionLabel.textFlow = >[
|
|
{text: "X 轴方向的加速度\n"}
|
|
, {text: e.acceleration.x, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\nY 轴方向的加速度:\n"}
|
|
, {text: e.acceleration.y, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\nZ 轴方向的加速度:\n"}
|
|
, {text: e.acceleration.z, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\nX 轴加速度(考虑重力加速度)\n"}
|
|
, {text: e.accelerationIncludingGravity.x, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\nZ 轴方向的加速度:\n"}
|
|
, {text: e.accelerationIncludingGravity.y, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\nZ 轴方向的加速度:\n"}
|
|
, {text: e.accelerationIncludingGravity.z, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\n左右旋转速度（alpha轴向的角速度）\n"}
|
|
, {text: e.rotationRate.alpha, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\n前后旋转速度（beta轴向的角速度）\n"}
|
|
, {text: e.rotationRate.beta, style: {"textColor": 0xff0000}}
|
|
, {text: "\n\n扭转速度（gamma轴向的角速度）\n"}
|
|
, {text: e.rotationRate.gamma, style: {"textColor": 0xff0000}}
|
|
];
|
|
}
|
|
}
|
|
```
|
|
|
|
首先创建了DeviceOrientation的实例orientation。并给他添加了一个事件侦听器，监听它的CHANGE事件。然后调用了他的start()方法来开始监听设备方向的变化。 当系统监听到了方向的变化后，将回调函数 onOrientation。然后通过egret. OrientationEvent事件的三个属性来获取设备的方向变化信息。 OrientationEvent的三个属性：alpha, beta和gamma。 alpha表示设备绕 Z 轴的角度，单位是 角度 beta 表示设备绕 X 轴的角度，单位是 角度 gamma 表示设备绕 Y 轴的角度，单位是 角度 同样，创建了Motion的实例motion。并给他添加了一个事件侦听器，监听它的CHANGE事件。然后调用了他的start()方法来开始监听设备方向的变化。 当系统监听到了方向的变化后，将回调函数 onMotion。然后通过egret. MotionEvent事件的三个属性来获取设备运动的具体信息。 acceleration 表示设备在 X Y Z 轴方将的加速度信息，单位是 m/s2，不包含重力。 acceleration 表示设备在 X Y Z 轴方将的加速度信息，单位是 m/s2，包含重力。 rotationRate 表示设备在 alpha、 beta 和 gamma 三个轴向的角速度信息，单位是 角度每秒。 最终的效果demo->[传送门](https://demo.dengtongyu.com/pages/orientation/) 或者手机扫一扫：
|
|
|
|
|