AS2 Class.PhotoMatrixMotion HowTo
Esempio di applicazione della classe PhotoMatrixMotion
Inserito il 25-09-2006
Ecco una piccola classe per Flash 8, che sfrutta la classe ColorMatrixFilter per creare effetti sui colori dei MovieClip e le easing-functions per dinamicizzare il processo, può essere applicata in ogni occasione, anche se lo scopo per cui è stata scritta è quello di applicare i nostri effetti alle immagini, vedremo poi un esempio proprio in questo senso.
- Link all'esempio di applicazione
- Download della classe con esempio finale
Come è consuetudine quando si ha a che fare con le classi, salviamo il nostro file con estensione .as nella stessa cartella del file .fla in cui vogliamo sfruttare la classe. Fatto questo, apriamo il nostro .fla e individuiamo il movieclip a cui applicare gli effetti. In caso che il nostro MC sia il contenitore di una foto dovremo considerare il fatto che la classe potrà (dovrà) essere applicata solo quando l'immagine sarà completamente caricata. Nel nostro esempio sfrutteremo la mia Preload.Class, ma in generale potremo sfruttare un qualsiasi preload compresa la classe MovieClipLoader che approfondiremo in un altro articolo.
Analizziamo ora il costruttore della classe e i suoi parametri:
- target:MovieClip - indica il movieclip a cui verrà applicato l'effetto;
- from:Object - indica l'effetto di partenza del clip e può essere di tipo String o Array;
- to:Object - indica l'effetto finale del clip e può essere, come sopra, di tipo String o Array;
- ease:Function - la funzione di easing che preferiamo adottare, per saperne di più leggete l'articolo sull'applicazione della classe Tween;
- time:Number - la durata in secondi o frames della transizione;
- useSeconds:Boolean - true o false, è legato al parametro precedente "time", indica se tale parametro deve essere considerato come tempo in secondi o in numero di frames.
Terminata questa piccola analisi, facciamo un po' di chiarezza su due parametri lasciati un po' in sospeso nella loro definizione, che sono tra l'altro i parametri stessi che decidono quali sono gli effetti di partenza e di arrivo per il MovieClip, from e to. Abbiamo detto che i due parametri possono essere sia di tipo String che di tipo Array, questo perchè oltre agli effetti già integrati nella classe, di cui faremo poi l'elenco, è possibile "proporre" alla classe anche una matrice scritta da noi stessi, in modo da creare effetti diversi a seconda dell'array passato... l'unica cosa da tenere presente è che l'array deve essere costituito da 20 elementi che corrispondono ad una matrice di 5x4 elementi, così come richiesta dalla classe ColorMatrixFilter. questi sono invece gli effetti preimpostati, richiamabili semplicemente con una stringa che ne riporta il nome:
- normal;
- luminance;
- satured;
- in_satured;
- hue;
- contrast;
- in_contrast;
- deep_red;
- deep_green;
- deep_blue;
- deep_yellow;
- fluorescent;
- sepia.
Lascio a voi la scoperta di ogni effetto.
Passiamo ora all'ultimo "paragrafo" della nostra esposizione con un esempio pratico di applicazione (di cui possiamo scaricare il sorgente tra i link in alto).
// includo l'oggetto Preload #include "Preload.as" // creo un'istanza della classe Preload var p = new Preload(); // attivo le fasi di preload (affrontate nell'articolo sulla Preload.Class) p.onLoadStart = function(target:MovieClip) { // all'attivazione del preload spengo la visibilità del movieclip target._alpha = 0; }; p.onLoadProgress = function(target:MovieClip) { // associo al caricamento un TextField che mi mostri la percentuale caricata target._parent.testo.text = this[target._name+"__perc"]+"%"; }; p.onLoadInit = function(target:MovieClip) { // a fine preload riaccendo il movieclip target._alpha = 100; // e applico l'effetto conosciuto come "solarizzazione", in questo caso al contrario var effect = new PhotoMatrixMotion(target, "luminance", "normal", None.easeNone, 30, false); }; // creo un nuovo MovieClip sullo Stage var mc:MovieClip = this.createEmptyMovieClip("mc", 1); // carico l'immagine mc.loadMovie("image.jpg"); // attivo il Preload p.start(mc);
La classe permette anche di verificare il momento in cui l'effetto giunge al termine e grazie alla definizione di un metodo onMotionFinished, si possono ad esempio concatenare due effetti uno dopo l'altro, riprendendo il codice precedente, avremo:
#include "Preload.as"
var p = new Preload();
p.onLoadStart = function(target:MovieClip) {
target._alpha = 0;
};
p.onLoadProgress = function(target:MovieClip) {
target._parent.testo.text = this[target._name+"__perc"]+"%";
};
p.onLoadInit = function(target:MovieClip) {
target._alpha = 100;
var effect = new PhotoMatrixMotion(target, "luminance", "normal", None.easeNone, 30, false);
effect.onMotionFinished = function(){
var effect = new PhotoMatrixMotion(target, "normal", "satured", None.easeNone, 30, false);
}
};
var mc:MovieClip = this.createEmptyMovieClip("mc", 1);
mc.loadMovie("image.jpg");
p.start(mc);
Questo è tutto, come al solito sono gradite segnalazioni in caso di problemi o modifiche effettuate sulla classe originale, all'indirizzo "Segnalazioni" nella colonna di destra.
