Solutions cours smartphone

phonegap

Exercice 1

Cette application n'utilise pas la fonction de la boussole (Compass). Ajoutez un bouton qui indique l'angle que fait le téléphone avec le nord. Afficher la valeur de l'angle avec la fonction notification.alert fournie par phonegap.

• Solution:

Ajouter un bouton dans index.html <source lang="html5">

   <a href="#" class="btn large" onclick="read_compass();">Read Compass</a>

</source>

Ce bouton appelle la fonction read_compass définie dans main.js. Le reste est copié de la documentation phonegap. <source lang="javascript"> function read_compass(){

   navigator.compass.getCurrentHeading(onCompassSuccess, onCompassError);

}

function onCompassSuccess(heading){

   alert('Heading: ' + heading.magneticHeading);

}

function onCompassError(compassError){

   alert('Compass Error: ' + compassError.code);

} </source>

Exercice 2

Ce n'est pas pratique d'avoir le nord que quand on appuie un bouton. Modifiez la fonction pour qu'elle affiche l'angle à intervalle régulier, d'une manière similaire à toggleAccel

• Solution:

La solution est copiée sur la mesure de l'accélération.

Il faut ajouter un élément ou écrire la mesure de la boussole. <source lang="html5">

Heading

 

</source>

Il faut aussi ajouter un bouton pour déclencher et interrompre la mesure: <source lang="html5">

   <a href="#" class="btn large" onclick="toggleCompass();">Toggle Compass</a>

</source>

Le code javascript est presque indentique à celui de toggleAccel: <source lang="javascript"> var compassWatch = null;

function updateCompass(heading) {

   document.getElementById('heading').innerHTML = heading.magneticHeading;

}

function onCompassError(compassError){

   alert('Compass Error: ' + compassError.code);

}

var toggleCompass = function() {

   if (compassWatch !== null) {
       navigator.compass.clearWatch(compassWatch);
       updateCompass({magneticHeading:""});
       compassWatch = null;
   } else {
       var options = {};
       options.frequency = 1000;
       compassWatch = navigator.compass.watchHeading(
               updateCompass, 
               function(ex) {
                   alert("accel fail (" + ex.name + ": " + ex.message + ")");
               }, options);
   }

}; </source>