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;
        }
    })