Creare una Maschera sfumata in Flash
Oggi vedremo come creare una maschera sfumata.
Prima di tutto per realizzare un progetto simile dobbiamo usare una versione di flash 8 o superiore.
- Cos’è un livello maschera in Flash?
I livelli maschera sono un ottima funzione per produrre effetti tipo riflettore.
Attraverso una maschera, applicata ad un livello, si possono vedere solo certi oggetti dello stage mentre si svolge il filmato.
- Cos’è che cambia da una maschera normale?
La maschera deve essere effettuata sul livello, applicata tramite actionscript, indicando sia la maschera che l’oggetto mascherato, le quali dovranno essere dei movieclip.
Una cosa molto importante da fare, è di spuntare il check-box “Usa caching bitmap in runtime” nel pannello proprietà.
Vediamo come procedere per creare una maschera sfumata con Flash 8
Per creare questo effetto dovremo utilizzare il metodo setMask, vediamo come funziona:
Questa è la sintassi:
filmato_mc.setMask(mask_mc);
- filmato_mc: E’ un clip filmato di nome istanza filmato_mc che verà mascherato.
- mask_mc: E’ un clip filmato di nome istanza mask_mc che verrà usato come maschera.
Quindi tornando all’esempio, filmato_mc potrebbe essere un clip filmato con dentro un’immagine e mask_mc un clip filmato con un’animazione al suo interno, che viene utilizzata come maschera.
Infine per annullare una maschera creata con ActionScript, basterà passare il valore null al metodo setMask() senza incidere sul livello, in questo modo:
filmato_mc.setMask(null);
Scarica il sorgente
Guarda il Tutorial
File e source di Pasavign
Letture Consigliate per Design
-
HTML 5 e CSS 3 (Guida completa)
Prezzo: EUR 29,00
Promozione: EUR 21,75 -
Creare siti web standard e accessibili
Prezzo: EUR 32,00
Promozione: EUR 27,20 -
Strategie per essere visibili online
Prezzo: EUR 24,90
Promozione: EUR 21,16 -
Usare JavaScript (Guida completa)
Prezzo: EUR 32,00
Promozione: EUR 24,00
Articoli simili DesignFileFlashFree
Autore: Giuliano Ambrosio
Web Designer Freelance di Torino che ama la grafica e sperimentare tecniche di creatività sul web. Grazie all'esperienza maturata nel campo del web design potrai scoprire i servizi disponibili, oppure guardare i suoi ultimi lavori.
20 Commenti
Scrivi un Commento
Contributor
Stefanelli
10 Indispensabili Consigli SEO per Web Designer Freelance
Oggi vediamo alcuni indispensabili consigli SEO per migliorare la visibilità dei siti web o ancora meglio degli articoli, con lo scopo di migliorare la predisposizione all’indicizzazione dei nostri progetti web sui motori di ricerca. Ormai anche il Web Designer, soprattutto se è ha intrapreso la carriera da Freelance, deve assolutamente conosce alcune nozioni base della SEO. [...]
Rigato
Path: Alla scoperta del Social Network Esclusivo
Come ogni giorno, mi ritrovo a girovagare per il web: news dal mondo, articoli di nuovi o aggiornamenti social, altro vip che si cancella da Twitter… solita routine, quando ad un tratto vengo attratto dalla notizia di un nuovo Social Network super esclusivo. Già avevo sentito parlare di Path, ma non so per quale strano [...]
Gallo
Lo Shock Marketing nel 2012 con LUSH + [Video Shock]
Sono sempre troppo poche le campagne creative che puntano a sensibilizzare sulla causa animalista, contro le violenze e i test sugli animali, eppure quelle che hanno colpito di più l’immaginazione sono scolpite nelle coscienze di ognuno come segni indelebili. Tra tutte, una delle più meritevole degli ultimi anni è quella dell’azienda inglese LUSH, che ha [...]
Donno
Christophe Huet: Quando il Fotoritocco Diventa Surreale
Christophe Huet è un fotografo specializzato nel fotoritocco digitale, che divide facilmente le opinioni del pubblico, in quanto sappiamo benissimo che esistono due distinte correnti di pensiero. I primi, puristi della foto per i quali la manipolazione è da pena di morte, e i secondi, gli artisti del fotoritocco come Christophe che del fotoritocco hanno [...]
Guide In Evidenza
Usare un Metodo di Lavoro Efficace
Responsive Web Design: I Migliori Tutorial & Risorse
Progettare e realizzare un layout grafico per iPad
Progettare un Layout Grafico che funzioni
Facebook: Creare una Pagina Personalizzata
Creare un layout per iPhone: Trucchi e Consigli
Creare un Blog Popolare partendo da zero
Video Tutorial Adobe Photoshop
Il Meglio del Blog
I love WordPress - JuliusDesign P.IVA 10079630017 - Tutti i contenuti sotto Licenza Creative Commons - Advertise - Contatti - Policy
The advertisement is handled by BlackGeek Ltd
floppy
7 novembre 2007
ma, per pura curiosità, c’è qualcosa su questo blog che hai fatto tu ?
Gogeta86
7 novembre 2007
Ottimo tutorial, spiegato anche bene
Julius
8 novembre 2007
@floppy ciao non riesco a capire se la tua domanda sia provocatoria o meno comunque ecco l’elenco dei tutorials flash per ora sul blog, fatti da me a grande richiesta:
Apertura di una popup da Flash
Banner Random in Flash
Classe Key
Classe Sound();
Classe Tween
ComboBox Flash
Creare pulsanti Web 2.0 con Flash 8
Dynamic Gallery con miniature scorrevoli
duplicateMovieClip – Duplicare oggetti
Flash con sfondo trasparente
Flash e Database MySQL
Flash e Lightbox
Flash Overlay: Scrivere sull’HTML
FLVplayer dinamico con playlist
FLVPlayer Dinamico Liquido
Galleria dinamica v1 in Flash
Google in Flash
Intercettare Inattività dell’USER
iPodPlayer in Flash: Nuova versione
iPodPlayer – Riproduttore Mp3
LoadMovie in coordinate dinamiche
_lockroot: a cosa serve? Come funziona?
Mini Player Mp3 in Flash
Newsletter: Gestione in Flash
News verticali dinamiche in Flash
PageFlip e LightBox
Preloading Flash stile Windows Vista
Quiz in flash
Seguire il mouse con effetto decellerato
Stage Resize – Resize automatico
Trascinare un oggetto
Pulsante trasparente
Non ho messo il link perchè non mi sembrava il caso di perdere tempo…
gipris
8 novembre 2007
Bella risposta, bravo!
per quanto riguarda la mascheratura… utilissima! thx :)
Daniela
9 novembre 2007
Julius > Sinceramente penso che sei 1 persona che davvero le sa le cose, infatti, non è la prima volta che su “richiesta” mi aiuti a risolvere 1 problema!
E per la maskera sfumata! davvero 1 cosa utile! Grazie anche per aver uppato il sorgente!
Don’t Break My Ball: Scegli il vincitore! « JuliusDesign
23 novembre 2007
[...] Autore Floppy su Creare una Maschera sfumata in Flash [...]
Microcipcip
10 febbraio 2008
Ciao, ho un problema con questo tutorial. Ho provato a ricrearlo usando immagini differenti, però quando clicco sul pulsante l’immagine che appre non è sfumata! Come maschera ho usato un cerchio con gradiente radiale, il gradiente ha l’opacità settata a 0% nel bordo esterno, ma continuo a vedere l’immagine senza la sfocatura. Sai dirmi perchè?. Grazie in anticipo.
ilaria
13 aprile 2008
ciao,
magari hai gia risposto, ma non ho trovato nulla per ora.
ho lavorato sul sorgente, ma se voglio usare la stessa maschera per nascondere altre immagini oltre la prima?
quando lo faccio non sembra piu funzionare e vedo la maschera colorata…
grazie
ilaria
Julius
13 aprile 2008
Hai impostato come nell’esempio la maschera alle altre immagini?
marcob
17 agosto 2008
pero , in flash mx 6.0 , non il checkbox “Usa caching bitmap in runtime”
come posso fare (Senza scaricare la versione nuova) a farlo ?
Marco Siviero
30 agosto 2008
Bella julius ;)
Pierpaolo
9 gennaio 2009
Ciao, vorrei imparare a fare questo tipo di maschera, ma devo ammettere che nonostante non sia solo alle basi e il tutorial è spiegato bene, non riesco a realizzarla, mi daresti una mano con le specifiche passo passo da fare???
con un elenco numerato su cosa fare in ordine, grazie
SARA
15 giugno 2009
CIAO JULIUS…COME FACCIO A DIRE ALLALBERO CHE DEVE USCIRE SENZA IL PULSANTE??
MI SERVE CHE APPENA PARTE IL MOVIE ESCE FUORI…
Julius
21 giugno 2009
@SARA: Ciao sara!
Livello Layer6 primo frame sostituisci tutto con
this.onLoad = function() {this.tree.setMask(this.mask);
this.mask.play();
};
James
6 marzo 2010
Ciao a tutti sono nuovo e alle primissime armi, ma vorrei creare una banner dove al posto dell’albero devo far crescere una casa ho provota con le guide presenti nel sito e cercando in internet ma non sono riuscito a fare niente. mi sapete indicare una guida passo passo per ottenere questo effetto?
grazie mille
Roger
7 febbraio 2011
Resta un mistero per uno che di script non capisce una mazza come si fa a:
1) rendere invisibile l’albero già dal primo frame, ovvero a farlo comparire da zero;
2) come avviare l’animazione in automatico senza bisogno del click sul pulsante.
Qualcuno può aiutarmi?
Roger
7 febbraio 2011
Roger ha scritto:
———–
Pur applicando la modifica che hai proposto a Sara l’albero si vede ugualmente per una frazione di secondo (ovvero al primo frame).
Sto cercando di utilizzare questo trucco come transizione a tendina tra una clip e l’altra ma per fare questo la timeline deve essere inserita in una altra timeline dov’è presente una clip precedente.
Così facendo avviene una cosa molto strana, ovvero che prima che la maschera faccia l’effetto previsto la si vede passare una volta con il suo colore originale nascondendo la scena.
C’è un modo per risolvere questo baco?
Lapo
25 marzo 2011
Ancora non mi è chiara una cosa..questo valore qui:
filmato_mc.setMask(null);
che si serve per bloccare l’actionscript, dove devo metterlo se volgio che la mia sfumatura mi parta in automatico indipendentemente dal pulsante?
michela
23 maggio 2012
ilaria ha scritto:
ma in questa situazione:
this.onLoad = function() {
this.tree.setMask(this.mask);
this.mask.play();
};
che ho cambiato con
this.onLoad = function() {
this.tree2.setMask(this.mask2);
this.mask2.play();
};
cambiando anche il nome istanza alla maschera e al mc…
ma la maschera non viene applicata… cosa sbaglio!?
Ho lo stesso problema…
Michela
23 maggio 2012
Ciao!
ho scaricato il sorgente, e attivato la maschera togliendo il pulsante. Ho bisogno però di un filmato in loop, però quando ricomincia la maschera non funziona più…
Come si fa’?
Grazie mille per il tutorial!