This is a discussion on Effetto acqua con Flash CS3 within the Articoli e tutorials forums, part of the Flash CS3 e Actionscript 3.0 category; Un altro effetto creato con Actionscript 3.0 e in particolar modo le classi BitmapData e DisplacementMapFilter.
L' effetto ricrea ...
Un altro effetto creato con Actionscript 3.0 e in particolar modo le classi BitmapData e DisplacementMapFilter.
L' effetto ricrea un ambiente con 2 tende canadesi a bordo del lago in una notte di luna piena.
Piacevole l' effetto dell' acqua che si muove.
package
{
import flash.display.MovieClip;
public class Immagine extends MovieClip
{
public function Immagine(){}
}
}
Stella.as:
Code:
package
{
import flash.display.MovieClip;
public class Stella extends MovieClip
{
public var vx:Number;
public var vy:Number;
public function Stella(){}
}
}
Analizziamo il codice
Una delle novità in questo script è l' utilizzo della classe DisplacementMapFilter, che non è disponibile tra i filtri che Flash mette a disposizione nel pannello proprietà. Per utilizzare questo filtro, è necessario usare Actionscript.
Sostanzialmente con questa classe, si possono selezionare dei pixels di un' immagine e muoverli mentre i pixels non selezionati rimangono fermi.
Questa classe è molto usata per elaborare/deformare immagini e creare effettistiche in cui si deve cambiare la morfologia dell' immagine stessa.
DisplacementMapFilter utilizza una sorta di mappatura per dire a Flash quali pixels deve muovere dell' immagine. Di solito questa mappa ha la stessa misura dell' immagine, per cui il numero di pixels della mappa sarà lo stesso numero di pixels che contiene l'immagine che vogliamo animare.
Nella mappa, più scuro è il colore che diamo al pixel più forte sarà il nostro effetto. Quindi una mappatura tutta bianca manterrebbe l' immagine uguale all'originale (nessun effetto).
Per creare una nuova istanza di DisplacementMapFilter bisogna dare un' occhiata ai parametri che necessita:
mapBitmap: (BitmapData) la BitmapData che contiene la mappatura di ogni pixel.
mapPoint: (Point) indica il massimo punto in alto a sinistra da dove iniziare l' effetto.
componentX: (uint) quale colore usare per muovere i pixels sull' asse delle X. (ricordo, più scuro è il colore, più lo spostamento sarà accentuato).
componentY: (uint) quale colore usare per muovere i pixels sull' asse delle Y.
scaleX: (Number) di quanto vogliamo scalare l' asse X.
scaleY: (Number) di quanto vogliamo scalare l' asse Y.
mode: (String) il modo o effetto desiderato ( ne abbiamo 4 a disposizione:clamp,color,ignore,wrap)
color: (uint) specifica il colore da utilizzare solo se il mode è impostato a 'color'
alpha: (Number) specifica la trasparenza da usare solo se il mode è impostato a 'color'
Chiaramente nel mio esempio, questa classe viene utilizzata sotto un intervallo ENTER_FRAME e vengono passati dei valori come parametri che sono sempre diversi ad ogni iterazione dell' intervallo stesso.
Quindi:
creo la MovieClip su cui voglio agire al cui interno deve avere un'immagine tracciata ( in questo caso l'ho chiamata tagetClip_mc ).
creo una BitmapData
bit_data=new BitmapData(726,370,false,0);
creo un punto
point=new Point(0,0);
creo la DisplacementMapFilter
spostamento=new DisplacementMapFilter(bit_data,point,1,2,10,30);
e poi come tutti ifiltri, lo inserisco in un Array e poi do in pasto l' Array alla proprietà filters della MovieClip
filtri_array=new Array();
filtri_array.push(spostamento);
targetClip_mc.filters=filtri_array;
PS: Non ho dimenticato il data tyoe, ma semplicemente sono tutte variabili che già avevo dichiarato in testa dello script . Come sempre, ricordiamoci che stiamo lavorando su file .as quindi il datatype è fondamentale e obbligatorio.
Tutto il resto del codice riguarda il caricamento di un SWF esterno ( l' uccello che vola ), il posizionamentodelle stelle ed altre piccole cose su cui non mi soffermo.
Le parti importanti sono le ultime righe del metodo goEffect, chiamato sotto intervallo ENTER_FRAME:
creo ogni volta un nuovo punto ( la variabile z è già stata stata dichiarata )
var point:Point=new Point(z,z/2);
utilizzo il metodo perlinNoise della nostra variabile bit_data a cui era stato applicato il filtro DisplacementMapFilter
bit_data.perlinNoise(100,10,2,523,true,false,7,tru e,[point,point]);
dico a DisplacementMapFilter ( che adesso è targetClip_mc.filters ) di mappare la BitmapData ( bit_data )
targetClip_mc.filters.mapBitmap=bit_data;
incremento il valore della variabile z:
z++;
ripasso il nuovo filtro mappato alla proprietà filters della MovieClip:
targetClip_mc.filters=targetClip_mc.filters;
Ciao a tutti.....mi rimetto alla vostra generosità!!!!!!!!
Sto preparando una intro per il mio sito....essendo una mezza calzetta vi chiedo AIUTO!!!!
Vorrei far funzionare l'effetto acqua su un MC animato (logo_intro)...e che finita l'animzione rimanga l'effetto fino ad un click del visitatore su inglese/italiano.....è possibile? (spero di si)
da quello che ho capito flash è praticamente illimitato....aggiungo....molto complicato..
A lavoro finito dovrebbe venire....un gran bell'effetto....
ahh capito.. ma secondo voi, è possibile creare un ciclo o similare, in modo che faccia i calcoli una volta sola senza ciucciare CPU di continuo?
Se i calcoli vengono fatti una sola volta, l'effetto non ci sarebbe.
Il punto del enterFrame è di richiamare la funzione che fa girare il tutto e cosi di aggiornare l'effetto in continuazione.
Sto provando a creare l'effetto acqua, ma mi sfugge qualcosa. Sono partito dall'esempio scaricato qui ma mi perdo quando comincio ad eliminare quello che non mi serve.
Io vorrei applicare l'effetto soltanto ad una immagine con dimensioni 448x33.
Non c'è un esempio che applica l'effetto acqua soltanto ad un'immagine?