JavaScript中的设备事件 — 第13.4.8节

JavaScript中的设备事件

一：检测屏幕旋转的角度：orientationchange

  苹果公司为移动Safari浏览器中添加了orientationchange事件，用来检测屏幕的旋转状态，它对应的属性window.orientaion：它一共有三个状态：

• 0：正常状态；
• -90：手机向右横屏；

• 90：手机向左横屏。

  不过我在安卓的魅族手机上和小米手机测试了也可以用到orientationchange事件。

  二：检测带有加速指针设备的事件：MozOrientation

    MozOrientation事件是一个有趣的事件(但不是标准事件，正在修改中，具有加速器的设备可以用)，它对应的event对象的属性event.x、event.y、event.z分别代表三个方向的垂直加速度，但是以下代码测试没有成功，所以不建议使用这个事件，代码如下：

var mydiv = document.getElementById("myDiv");
        EventUtil.addHandler(window,"MozOrientation",function(event){
            alert();
            mydiv.innerHTML = "Current Mozorientation is (" + event.x + ',' + event.y + event.z + ')';
        });
           

三：检测设备在空间朝向事件：deviceorientation

  和MozOrientation事件类似，deviceorientation事件主要告诉开发人员设备在空间中的朝向，而不是怎样移动。触发deviceorientation事件的时候，它对应的event对象中包含着5个相应的属性值：

1. alpha：（左右旋转时候），y轴的度数差，[0，360];

2. beta：（前后旋转），z轴度数差，[-180，180];

3.gamma：（扭转设备），轴度数差，[-90,90]；

4.absolute：表示设备是否返回一个绝对值；

5.compassCalibrated：表示设备的指南针是否校准过。

代码如下所示：

EventUtil.addHandler(window,"deviceorientation",function(event){
            compass.style.webkitTransform = "rotate(" + Math.round(event.alpha) + "deg)";
            output.innerHTML = 'event.alpha = ' + event.alpha.toFixed();
        });
           

四：检测设备在空间移动的事件：devicemotion

  devicemotion事件要告诉开发人员设备什么时候移动，它对应的event对象属性有：

1.acceleration：x，y，z的对象，不考虑重力的情况下，每个方向的加速度；

2.accelerationIncludingGravity：x，y，z属性的对象考虑z轴自然重力情况下的每个方向的加速度；

3.interval：用毫秒表示的时间值，必须在另一个devicemotion是覅女触发之前传入。是个常量。

4.rotationRate：包含方向的alpha、beta和gamma属性的对象。

如果读取不到上面的三个属性，则他们的值为null，所以要首先检测一下到底这三个属性有没有值。代码如下：

EventUtil.addHandler(window,'devicemotion',function(event){
        var mydiv = document.getElementById('myDiv');
        if(event.rotationRate !== null){
            mydiv.innerHTML += "alpha=" + event.rotationRate.alpha + ",Beta=" + 
                event.rotationRate.beta + ",Gamma=" + event.rotationRate.gamma;
        }
    })