Corso Tecnologie Mobile - Lezione laboratorio 3

968 views

Published on

Slide della terza attività di laboratorio del corso ENAIP in Tecnologie di Rete Mobile. Realizziamo insieme un semplice gioco del calcio che fa uso dei sensori di movimento del dispositivo per gestire la posizione della palla sul campo.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
968
On SlideShare
0
From Embeds
0
Number of Embeds
49
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Corso Tecnologie Mobile - Lezione laboratorio 3

  1. 1. + Tecnologie Mobili - Lezione Laboratorio 3 Diamo un calcio ai sensori
  2. 2. + 2 Requisiti  Sviluppareuna applicazione che consenta di simulare il gioco del calcio mediante il movimento del dispositivo stesso   Muovere il pallone al variare dell’orientamento del dispositivo   Segnalare eventuali goal e gestire il punteggio Dr. Paolo Casoto, Ph.D - 2011
  3. 3. http://www.flickr.com/photos/kirente/2050650505 + 3 Dr. Paolo Casoto, Ph.D - 2011
  4. 4. + 4 Passo 1 - Creazione del progetto   Creiamo un progetto come abbiamo già fatto la scorsa settimana, per iPhone, senza abilitare alcuna opzione Dr. Paolo Casoto, Ph.D - 2011
  5. 5. + 5 Passo 2 – Importiamo le librerie necessarie   Prima di avviare la realizzazione del progetto dobbiamo importare 2 librerie necessarie al nostro progetto   COREMOTION: libreria per la gestione delle informazioni relative al movimento del dispositivo;   AUDIOTOOLBOX: libreria per la gestione dei suoni, la utilizzeremo per fornire feedback all’utente   Importeremo le due librerie all’interno dei file ViewController.h e ViewController.m Dr. Paolo Casoto, Ph.D - 2011
  6. 6. + 6 Passo 3 – Inseriamo le componenti grafiche   Di cosa abbiamo bisogno ?   Una UIImageView che funga da sfondo (nel progetto trovate back.png) e che sia collocata come layer più arretrato.   Una UIImageView per la visualizzazione della palla (ball.png)   Una UIImageView per la visualizzazione del messaggio di GOAL (goal.png)   Due etichette per riportare il punteggio delle due squadre. Poiché nel corso del progetto animeremo le varie componenti in movimento, è opportuno che il layer superiore sia utilizzato per l’immagine con il messaggio “goal”, mentre al di sotto sarà disposto il layer della palla. Dr. Paolo Casoto, Ph.D - 2011
  7. 7. + 7 Passo 3 – Inseriamo le componenti graficheImpostiamo a 0il canale alphadel messaggio“GOAL”rendendolo deltutto trasparente Dr. Paolo Casoto, Ph.D - 2011
  8. 8. + 8 Passo 4 – Aggiungiamo i riferimenti all’interno del codice   All’interno del codice dobbiamo aggiungere i riferimenti ad alcuni elementi o attività della nostra interfaccia grafica.   Quali ?   Le due etichette…poiché dobbiamo scriverci all’interno.   Le due immagini (palla e messaggio “goal”) poiché dovremmo animarne movimento e visibilità. Dr. Paolo Casoto, Ph.D - 2011
  9. 9. + 9 Passo 4 – Aggiungiamo i riferimenti all’interno del codice Dr. Paolo Casoto, Ph.D - 2011
  10. 10. + 10 Dr. Paolo Casoto, Ph.D - 2011
  11. 11. + 11 Gestione dei movimenti in iOS 5   In iOS 5 la gestione del monitoraggio dei movimenti del dispositivo è delegata al framework CoreMotion   Con l’eccezione del movimento di shaking, che è annoverato fra e gesture e gestito come tutte le altre gesture (e.g.: pinch).   Fino ad iOS 5 era possibile utilizzare le informazioni derivanti dalla classe UIAccelerometer e gestire il cambio di accelerazione da essa segnalata. Tali funzionalità oggi sono deprecate e ne è sconsigliata l’adozione su nuove app.   Il framework è in grado di gestire un insieme eterogeneo di dati da due diverse tipologie di sensori: giroscopio ed accelerometro.   Il framework effettua la fusione dei dati mediante opportuni algoritmi in un proprio thread separato. Dr. Paolo Casoto, Ph.D - 2011
  12. 12. + 12 Core Motion   La classe principale per l’accesso alle funzionalità del framework Core Motion è CMMotionManager.   E’ consigliabile istanziare un solo oggetto di tale classe per ciascuna applicazione (pattern Singleton) per evitare di incidere sulla frequenza di aggiornamento dei dati da parte del dispositivo.   E’ in grado di monitorare 3 tipologie di dati:   CMAccelerometerData: misurazione dell’accelerazione del dispositivo lungo i 3 assi.   CMGyroData: misurazione della rotazione del dispositivo, misurata dal giroscopio, lungo i 3 assi. Dr. Paolo Casoto, Ph.D - 2011
  13. 13. + 13 Core Motion   CMDeviceMotion: mediante gli algoritmi di fusione dei dati provenienti da accelerometro e giroscopio è in grado di determinare con elevata accuratezza accelerazione, direzione della gravità e rotazione del dispositivo (la cosiddetta attitude).   L’analisi dei dati relativi al movimento può avvenire in due modalità:   Pull: l’applicazione richiede l’avvio del monitoraggio e periodicamente controlla le modifiche ai valori misurati   Push: l’applicazione richiede il monitoraggio al framework ad intervalli personalizzabili e fornisce un blocco funzionale per la gestione dell’aggiornamento (callback) Dr. Paolo Casoto, Ph.D - 2011
  14. 14. + 14 Core Motion   Nell’ambito del nostro progetto siamo interessati a monitorare il solo accelerometro con modalità push ed intervallo pari a 1/25 secondi   Con una frequenza di aggiornamento pari al frame rate di un film   Definiamo all’interno del controller un oggetto CMMotionManager che inizializzeremo allinterno del metodo viewDidLoad.   Avviamo il processo di monitoraggio mediante il metodo startAccelerometerUpdatesToQueue:withHandler: definendovi all’interno il blocco per l’animazione della palla   Ricordatevi di chiudere il processo di monitoraggio all’uscita dal controller (viewDidUnload) Dr. Paolo Casoto, Ph.D - 2011
  15. 15. + 15 Dr. Paolo Casoto, Ph.D - 2011
  16. 16. + 16 Aggiornare la posizione della palla   Dai dati ricavati dal monitoraggio della posizione otteniamo i valori x ed y di accelerazione sui due assi.   Moltiplichiamo per 10 per ottenere un ipotetico intervallo di spostamento in pixel.   L’asse y deve essere invertita per compensare l’inversione dell’asse in fase di visualizzazione.   Gestiamo i casi limite di prossimità con i bordi   Definiamo le aree destinate alle due porte come due rettangoli e verifichiamo se la nuova posizione della palla interseca una delle due porte   In tal caso aggiorniamo il punteggio.   In caso di goal riportiamo la palla a centrocampo Dr. Paolo Casoto, Ph.D - 2011
  17. 17. + 17 << Inizializzo il gestore del movimento << Funzione di callback << Aggiorno i valori della posizione del pallone Dr. Paolo Casoto, Ph.D - 2011
  18. 18. + 18 << Gestisco i casi limite << E verifico la presenza di eventuali goal << Muovo il pallone ed aggiorno i punteggi in caso di goal Dr. Paolo Casoto, Ph.D - 2011
  19. 19. + 19 Interagire con gli elementi dell’interfaccia grafica   Gli elementi dell’interfaccia grafica possono essere gestiti solo dal thread principale dell’applicazione   I thread non principali non possono modificare gli elementi dell’interfaccia grafica   Poiché la funzione di callback che il sistema invoca al variare dei dati di movimento è eseguita dal thread di Core Motion, essa non può modificare direttamente gli elementi dell’interfaccia grafica   Per farlo è necessario esplicitare la richiesta, sotto forma di blocco funzionale, al thread principale.   Aggiungo un blocco alla coda di esecuzione del thread principale, ottenuta come [NSOperationalQueue mainQueue] Dr. Paolo Casoto, Ph.D - 2011
  20. 20. + 20 Aggiungiamo un po’ di feedback   Aggiungiamo alla nostra app un feedback esplicito in caso di goal   Vibrazione   Immagine con il messaggio “Goal”   Vogliamo rendere quanto più fluida la visualizzazione del messaggio, con un effetto a comparsa / scomparsa.   Agiamo definendo una animazione che va a modificare il valore del canale alpha dell’immagine associata al messaggio di goal   Vi ricordate che all’inizio lo abbiamo impostato a 0 ? Dr. Paolo Casoto, Ph.D - 2011
  21. 21. + 21 << Vibrazione << Fa comparire il messaggio di goal << Fa scomparire il messaggio di goal Dr. Paolo Casoto, Ph.D - 2011
  22. 22. 22Dr. Paolo Casoto, Ph.D - 2011
  23. 23. 23Dr. Paolo Casoto, Ph.D - 2011
  24. 24. 24Dr. Paolo Casoto, Ph.D - 2011
  25. 25. + Domande ??? Grazie a tutti per l’attenzione Dr. Paolo Casoto, Ph.D - 2011

×