Chi ha già lavorato con Flash si sarà trovato di fronte, più volte, alla possibilità, creando interpolazioni di movimento, di applicare un "easing in" e un "easing out", praticamente degli effetti di accelerazione che consentono di variare la velocità dell'animazione, rendendola quindi non lineare.
Per esempio l'easing in crea un'animazione inizialmente lenta che man mano acquista velocità. È possibile fare lo stesso con Actionscript, usando la classe Tween e il package relativo alle easing equation; a tal proposito un tutorial che può essere utile è "Using the Tween Class".
Generalmente possiamo tradurre il termine "easing" con "accelerazione", inteso come cambio di velocità (quindi può anche rappresentare un rallentamento, cioè un'accelerazione negativa).
Anche Sandy ha delle funzioni che permettono di creare degli effetti di accelerazione (ovviamente in 3D) utilizzando gli interpolatori e la classe Ease.
Un oggetto Ease può essere impostato per applicare un determinato effetto di movimento; con il metodo possiamo selezionare il tipo di funzione usata per eseguire il calcolo, mentre con il tipo stabiliamo il tipo di movimento.
Listato 26. Ease applica un determinato effetto di movimento
var easing = new Ease();
easing.easingIn( strenght ); // Applica un'accelerazione all'inizio dell'animazione
easing.exponential(); // Usa una funzione esponenziale per i calcoli
Tutte le funzioni usate per impostare l'accelerazione ritornano come valore un oggetto Easing, per cui possono essere concatenate.
var easing = new Ease();
easing.easingIn( strenght ).easing.exponential();
I principali metodi e tipi messi a disposizione dalla classe Ease sono i seguenti:
- Metodi
linear()circular()sin()cubicBezier()exponential()
- Tipi
easingIn(a): Accelerazione applicata ad inizio animazioneeasingOut(a): Accelerazione applicata a fine animazioneeasingInToIn(a,c): Due accelerazioni successive di tipo INeasingInToOut(a,c): Due accelerazioni successiva, una di tipo IN e una di tipo OUTeasingOutToIn(a,c): L'opposto del precedenteeasingOutToOut(a,c): Due accelerazioni successive di tipo OUTbounce(b,r,e): Effetto rimbalzoelastic(b,r,e): Effetto elastico
Il parametro a indica la forza dell'accelerazione; il valore predefinito è 1.
Nei tipi che prevedono due parametri, c indica la frazione dell'intervallo, cioè quando l'accelerazione cambia dal primo tipo al secondo.
"Bounce" ed "Elastic" hanno come parametri b, ovvero il numero di rimbalzi (il valore predefinito è 1), r che indica la riduzione di forza tra un rimbalzo e l'altro, ed e che è una funzione opzionale utilizzabile per rimpiazzare quella predefinita.
Un esempio pratico dei diversi tipi di equazione è un file realizzato da Robert Penner , uno dei più grandi esperti di easing equations.
Vediamo allora alcuni esempi, così da comprendere meglio l'utilizzo di queste funzioni.
La struttura dell'esempio rimane la stessa, ma andremo a modificare il metodo e il tipo per vederne gli effetti sul movimento del nostro oggetto.
Proviamo, per esempio, a impostare come tipo EasingOut ed exponential come metodo.
// Creiamo un nuovo oggetto Ease
var easing = new Ease();
// Impostiamo tipo e metodo
easing.easingOut(2.5).exponential();
Spostamento di un oggetto con Exponential EasingOut
Trovare i valori esatti per ottenere l'effetto desiderato può richiedere un po' di prove.
Vediamo cosa cambia nell'animazione utilizzando easingIn al posto di easingOut, così:
easing.easingIn(2.5).exponential();
Spostamento di un oggetto con Exponential EasingIn
"© Petit Publications 2006" - diritti riservati
