Dall'archivio script > Windows Phone

PhoneGap: gestire l'orientamento in Windows Phone

di Daniele BochicchioDaniele Bochicchio, in Windows Phone, PhoneGap,

PhoneGap è un framework per costruire applicazioni native utilizzando HTML5, che è disponibile anche per Windows Phone.

Una volta scaricato, aggiunge un nuovo template di progetto a Visual Studio, all'interno del quale potremo creare la nostra soluzione. Poiché PhoneGap è un layer tra il nostro codice HTML e le funzionalità native, in certi scenari dobbiamo adattarci alle sue caratteristiche per poter implementare funzionalità native.

Un caso di questo tipo è quello relativo alla gestione della rotazione del dispositivo: essendo PhoneGap un layer tra la parte nativa e quella HTML, dovremo intercettare l'evento orientationchange attraverso un semplice codice JavaScript, per poi decidere cosa fare.

Ecco l'esempio, dove si può notare l'approccio utilizzato da PhoneGap:

<!DOCTYPE html>
<html>
<head>
  ...
  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />

  <script type="text/javascript" src="phonegap-1.2.0.js"></script>
        
  <script type="text/javascript"><!--
    document.addEventListener("deviceready", onDeviceReady, false);

    // in questo stato il device è pronto
    function onDeviceReady()
    {
      // ci registriamo per l'evento orientationchange
      window.addEventListener("orientationchange", onOrientationChange, true);
    }
    
    // gestiamo l'evento
    function onOrientationChange(e) {
      var orientation = "portrait";
      // stabiliamo il tipo di orientamento
      if (window.orientation == -90 || window.orientation == 90) orientation = "landscape";
      
      // codice che applica le funzionalità specifiche per l'orientamento corrente
      document.getElementById("orientation").innerHTML = orientation;
    }
  //--></script>
<body>
...
</body>
</html>

Come si può notare, questo codice avrà l'effetto, quando ruotiamo l'emulatore (o il device) di scrivere a video la corrispondente rotazione corrente:

Link e riferimenti utili

Il nostro speciale sullo sviluppo web mobile
https://www.aspitalia.com/focuson/1267/Speciale-Web-Mobile-Costruire-Applicazioni-ASP.NET-JQuery-Mobile.aspx

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn
Aggiorna

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi