Da un po di tempo seguo attentamente gli articoli di un bravo Flasher (And80) di v2online.it e tra i vari articoli ho scovato la Classe ScaleSquare, che permette di applicare dinamicamente una serie di maschere per creare degli effetti eccezionali alle vostre fotografie, sfruttando le mx.transitions.easing.
La classe si applica in questo modo:
import mx.transitions.easing.*;
var scale:Object = new ScaleSquare(mioClip, 5, 5, mioClip._width, mioClip._height, true, Back.easeOut,1);I parametri da passare sono
- nome clip
- numero di colonne in cui suddividere la foto
- numero di righe in cui suddividere la foto
- larghezza del clip
- altezza del clip
- applicazione effetto con distribuzione random (true/false)
- tipo di transizione
Osservate l’esempio che ho riprodotto cliccando qui (by rempox)
Per saperne di più e scaricare la classe cliccate qui (by v2online.it)
























11 Commenti a “Creare effetti dinamici tramite maschere”
Ciao volevo chiedere se è possibile applicare questa classe ad una maschera in modo che tra un’immagine e l’altra nn vi siano intermezzi bianchi.
Per capire meglio ti mando ad un sito
http://www.brevetticommerciale.it
Nell’angolo superiore sx c’è un esempio di come vorrei fare la transizione.
Aspetto notizie =)
PS: bellissimo il tuo blog
Ciao Andrea e grazie x i complimenti; la maschera è già generata da una classe e dunque non è possibile chiaramente; per gli intermezzi bianchi è chiaro che lo sfondo deve essere coperto da immagini.
Ciao Andrea,
se vuoi puoi vedere alcuni esempi nel mio sito
sezione download, seleziona MASK
e trovi la versione 4 e 5 con vari effetti dinamici
La 4 con sovrapposizione di immagini
Ciao
Ciao purtroppo nn riesco ad associare la classe all’immagine.
Io clicco sopra l’immagine (nome:imm1) e scelgo azioni e poi inserisco questo testo:
import mx.transitions.easing.ScaleSquare.as;
var scale:Object = new ScaleSquare(imm1, 5, 5, imm1._width, imm1._height, true, Back.easeOut, 1);
Però alla preview nn mi fa nulla…
Potete dirmi la procedura corretta?
Ciao Andrea, se ancora non lo avessi fatto ti consiglio di leggere le spiegazioni dal sito di And80 creatore della classe.
http://www.v2online.it/articoli/scalesquare_howto.html
In secondo luogo parliamo di movieClip che contengono la foto e non direttamente la foto (spero che fin qui sia tutto chiaro)
Terzo la classe deve risiedere nella stessa directory dove c’è il fla
Quarto il richiamo della classe non si scrive sull’oggetto ma sulla Frame della time line che contiene il clip.
in buona sostanza tu avrai sullo stage (relativo al livello 1 ed alla frame 1) il clip “img1″ che contiene la tua foto
poi selezioni la Frame1 tasto destro Azioni ed è li che scrivi il codice.
Saluti
Scusa ma all’inizio quando dice “import mx.transitions.easing.*” al posto dell’asterisco devo mmetterci qualcosa?
Perchè sennà cambiando solo il nome “mioClip” con il nome del mio clip e salvando il file .as nella stessa cartella del fla la cosa nn funziona.
Ok sono riuscito a fare un passo avanti ma nn funziona bene nel senso che l’animazione lo fa solo in un rettangolo in basso a dx e nn su tutta la foto.
NN è spiegato molto bene come inserire le dimensioni del clip… io ho scirtto solo il numero senza px e mi fa solo un rettangolino in basso a dx…
Eppure qui mi sembra molto chiaro (se si conosce un minimo di Action SCript però :) )
var scale:Object = new ScaleSquare(mioClip, 5, 5, mioClip._width, mioClip._height, true, Back.easeOut);
mioClip //
lo sostituisci con il nome di istanza del tuo clip che contiene la foto
5 //numero delle colonne
5 //numero delle righe
mioClip._width // rileva automaticamente la larghezza del clip
mioClip._height // rileva automaticamente l’altezza del clip
Non mi sembra ci sia altro.
“io ho scirtto solo il numero senza px ” ti confondi con la sintassi dei CSS
In sostanza i parametri da passare sono 3 “nomeClip” “colonne” e “righe”
una volta che ti funziona puoi variare gli altri parametri
combinando
* Regular – Produce un effetto di accelerazione o decelerazione regolare;
* Bounce – Produce un effetto “gravitazionale”;
* Elastic – Produce un effetto elastico;
* Strong – Produce un effetto di accelerazione o decelerazione “veloce”;
* Back – Produce un effetto elastico “assorbito”.
E possono essere utilizzate con tre tipi di movimento
* EaseIn – Accelerazione;
* EaseOut – Decelerazione;
* EaseInOut – movimento con accelerazione iniziale e decelerazione finale.
Ciao
Salve.
Ti ho conosciuto partendo da questo topic: forum . html . it/forum/showthread/t-1103917.html … Ho provato a seguire i link verso le guide da te postate ma il sito v2online NON è più attivo. Mi diresti dove posso documentarmi dalla A alla Z per imparare a fare tutto ciò?
Ormai molto tempo fa (sono passati forse quasi 10anni) usavo con ottimi risultati Flash Mx, ma ho mollato tutto … ora vorrei riappassionarmi di ciò ma dovrei rimparare dalla A alla Z.
Ci sono delle guide utili, specie per fare tali effetti, per imparare a fare cose splendide come rempox .it/articoli/class_ScaleSquare/index.asp???
Io vorrei per es. creare per il sito di un mio amico un effetto come per es. quello dell’header di stradagiuliabolgheri .it/it.html … Pensi sia fatto in Flash?
Grazie in anticipo!
Buongiorno, posso dirti una cosa: per quello di cui hai bisogno lascia perdere Flash e dirigiti verso HTML5, CSS3 e jQuery; il presente e il futuro non contemplano il Flash di una volta per me superato.