Per creare delle animazioni automatiche e scorrevoli, possiamo sfruttare uno (o più) degli interpolatori disponibili nella libreria di Sandy.
Gli interpolatori calcolano i punti tra i valori iniziale e finale di uno spostamento, rotazione o ridimensionamento; è anche possibile per esempio muovere uno o più oggetto lungo un percorso curvo.
Tutte le animazioni possono usare gli "easing methods", che permettono di creare un'animazione lineare oppure non lineare.
Prima di iniziare ad analizzare gli esempi è possibile scaricare i file relativi a questa parte dell'articolo.
Animazioni scorrevoli
Nella parte relativa alle trasformazioni abbiamo lavorato con un cubo animato, ruotandolo intorno a uno degli assi. Per ottenere il risultato prefissato abbiamo sfruttato l'evento onRenderEvent dell'oggetto World3D, aggiornando, ogni volta, la posizione e la rotazione del cubo, sfruttando la funzione rot() dell'oggetto Transform3D a cui passavamo i nuovi valori.
Come abbiamo detto l'evento onRenderEvent viene richiamato ogni volta che la scena è renderizzata. Inoltre il codice che abbiamo visto nella lezione precedente (Listato 23) può andar bene se assumiamo che l'oggetto da animare non abbia massa e si muova alla stessa velocità per tutta la durate dell'animazione; ma questo comportamento è decisamente limitativo!
Possiamo creare effetti molto più interessanti usando gli interpolatori e la classe Ease disponibili in Sandy. Lo scopo degli interpolatori è di calcolare i valori intermedi tra due valori (iniziale e finale) su un certo numero di fotogrammi.
Gli interpolatori principali sono:
- PositionInterpolator - Utilizzato per gli spostamenti
- RotationInterpolator - Utilizzato per le rotazioni
- ScaleInterpolator - Utilizzato per i ridimensionamenti
I valori da passare a tali interpolatori sono una easing function (funzione di movimento), la durata dell'animazione (espressa in fotogrammi) e i valori iniziale e finale dell'animazione. Le funzioni di movimento permettono di modificare il tipo di animazione, come vedremo in seguito. I valori iniziale e finale da passare all'interpolatore possono essere "angoli" nel caso di una rotazione oppure "vettori" nel caso di un movimento o di un ridimensionamento.
Ecco un esempio di movimento automatico sfruttando un interpolatore
Spostamento di un oggetto tramite interpolatore
La struttura del file Actionscript che stiamo utilizzando è simile a quella usata negli esempi visti finora. All'interno della funzione init() posizioniamo la telecamera in modo da avere una visuale adatta a rendere meglio l'animazione.
Listato 24. Inserisce la telecamera e la punta verso l'origine degli assi
// Posizioniamo la telecamera
cam.setPosition(-100,100,-500);
// e la puntiamo verso l'origine degli assi
cam.lookAt(0,0,0);
Associamo poi una funzione al pulsante, in modo da poter ri-eseguire il movimento quando vogliamo.
startButton.onRelease = doMove;
La funzione doMove è molto semplice:
function doMove(){
translation.redo()
}
L'interpolatore, quando l'animazione finisce, è in grado di ripeterla semplicemente utilizzando la funzione redo().
Nella funzione createScene() abbiamo apportato una modifica fondamentale: invece di avere un oggetto Transform3D, utilizziamo un PositionInterpolator.
Listato 25. createScene con PositionInterpolator
// Creiamo un TransformGroup e l'easing
var tTrans:TransformGroup = new TransformGroup();
var easing = new Ease();
// creiamo l'interpolatore che eseguirà l'animazione
translation = new PositionInterpolator( easing.create(),100, new Vector(-100,0,0), new Vector(100,0,0));
// L'interpolatore viene inserito nel TransformGroup
tTrans.setTransform( translation );
// La piramide viene inserita nella traslazione
tTrans.addChild( pyramid );
// Il TransformGroup è aggiunto al gruppo principale
bg.addChild( tTrans );
L'interpolatore utilizza la funzione di movimento creata dall'oggetto easing, ha durata di 100 fotogrammi e prevede che l'animazione parta dal punto -100,0,0 e finisca nel punto 100,0,0. Sarà quindi un movimento in linea retta sull'asse X.
Notiamo come l'interpolatore sia inserito nel TransformGroup tTrans, per cui calcolerà a ogni fotogramma la nuova posizione di tutto il gruppo e dei relativi oggetti.
Potrebbe sorgere spontaneo chiedersi come mai nel codice non sia presente un oggetto Transform3D, che risulta fondamentale per le trasformazioni; il motivo è molto semplice: si occuperà automaticamente l'interpolatore di creare e sfruttare un oggetto Transform3D.
"© Petit Publications 2006" - diritti riservati
