Se vogliamo dare agli utenti la possibilità di ruotare gli oggetti tramite la tastiera piuttosto che con il solo mouse, la via più semplice è ricavare lo stato di pressione di alcuni tasti ad ogni fotogramma; per ottenere un risultato simile a quello dell'esempio precedente useremo le frecce direzionali della tastiera e in base alla loro pressione modificheremo l'angolo di rotazione.
Come nel caso del mouse, vogliamo che la rotazione sia eseguita solo quando l'utente ha premuto uno o più tasti, per cui andiamo ad impostare il listener in questo modo:
Listato 65. Imposta il listener in base ai tasti premuti
Key.addListener(this);
onKeyDown = function(){
keydown = true;
}
onKeyUp = function(){
keydown = false;
}
Quando un qualsiasi tasto viene premuto, la variabile keydown viene impostata su true, mentre quando nessun tasto è premuto la variabile va impostata su false. Il codice per la nuova funzione rotate è invece il seguente:
Listato 66. Funzione per ruotare gli oggetti
function rotate() {
if(keydown){
y += ( Key.isDown( Key.LEFT )? 10:0 );
y += ( Key.isDown( Key.RIGHT )? -10:0 );
x += ( Key.isDown( Key.UP )? -10:0 );
x += ( Key.isDown( Key.DOWN )? 10:0 );
rotation.rot( x, y, z );
tg1.setTransform( rotation );
}
}
Notiamo come l'angolo di rotazione cambi solamente se ad essere premuta è una freccia direzionale. In base alla freccia premuta, l'angolo di rotazione viene aumentato o diminuito di 10 gradi, mentre se il tasto premuto non è una freccia direzionale l'angolo viene impostato a 0 (quindi nessuna nuova rotazione).
Il risultato ottenuto in questo esempio non è esattamente lo stesso del caso precedente, infatti prima la rotazione era calcolata in base alla distanza del mouse dagli oggetti, cosa che questa volta non è fattibile perchè... i tasti non si possono trascinare! Per questo motivo abbiamo impostato un valore fisso per ogni fotogramma.
Nella dimostrazione qui sotto possiamo paragonare i due metodi di funzionamento, infatti è possibile muovere gli oggetti sia con le frecce direzionali che con il mouse, così da notare direttamente la differenza.
Esempio della rotazione, sia con mouse che con tastiera
Alcune considerazioni sulla tastiera
Testando questi esempi all'interno dell'ambiente di sviluppo di Flash, o nel Flash Player standalone, non riscontriamo alcun problema con le azioni associate ai tasti e tutto funziona come previsto. Se però il filmato è all'interno di un browser, dobbiamo considerare alcune cose: innanzitutto, il filmato Flash deve avere il focus attivo su di esso per poter intercettare gli eventi provenienti dalla tastiera. Normalmente è il documento HTML ad avere il focus, per cui le azioni eseguite tramite tastiera vengono intercettate dal browser, quindi è necessario cliccare sul filmato per dargli il focus e fare in modo che intercetti la pressione dei tasti. Qualora l'utente clicca nuovamente sulla pagina HTML (o comunque fuori dal file SWF) il filmato perderà nuovamente il focus.
Certamente è un comportamento corretto, perchè, altrimenti, non potremmo più controllare il browser dalla tastiera nel momento in cui fossero presenti degli SWF nella pagina, però è un aspetto da tenere presente.
Nota: un problema molto più fastidioso (e meno "sensato") è il cosiddetto "wmode bug", riscontrato su Firefox: quando includiamo un filmato Flash in un documento HTML, possiamo impostare il parametro wmode in modo che lo sfondo dell'swf risulti trasparente, in questo modo:
Quando questo parametro è attivo, sembra che la funzione Key.isDown di Actionscript restituisca sempre il valore false. Questo avviene attualmente su Firefox 2 per Windows; quindi, a meno che non sia assolutamente necessario, evitiamo di utilizzare lo sfondo trasparente. Una discussione interessante sul problema, con alcune soluzioni, è disponibile sul blog di Johan Van Mol.
"© Petit Publications 2006" - diritti riservati
