Offuscare il contenuto e lo sfondo con Flash CS3

[Flep]

Spesso mi è capitato di ricevere richieste in cui mi si chiedevano alcune dritte su come offuscare tutto il contenuto dell' SWF al click di un bottone per poi far apparire una popup ( sempre all' interno di Flash ) o qualcosa del genere.

Quindi ho deciso di creare un paio di esempi.

Il primo è se tutto il contenuto è composto da diversi oggetti e quindi senza un contenitore.

Il secondo è se avete tutto il contenuto dell' SWF in una MovieClip che funge da contenitore ( scelta sempre migliore ).

Nel secondo caso possiamo applicare anche un lieve BlurFilter all' intero contenuto mentre nel primo caso applicheremo solo una specie di pellicola semi-trasparente.

Esempio 1:

con relativo codice:

var film_mc:MovieClip;
var pop:PopUp;

pop_btn.addEventListener(MouseEvent.MOUSE_DOWN,openPopUp);

function openPopUp(evt:MouseEvent):void
{
	createFilm();
	attachPopUp();
}

function createFilm():void
{
	film_mc=new MovieClip();
	film_mc.graphics.beginFill(0xFFFFFF,1);
	film_mc.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
	film_mc.alpha=0.5;
	addChild(film_mc);
}

function attachPopUp():void
{
	pop=new PopUp();
	pop.x=stage.stageWidth/2-pop.width/2;
	pop.y=stage.stageHeight/2-pop.height/2;
	addChild(pop);
	
	pop.close_mc.mouseChildren=false;
	pop.close_mc.buttonMode=true;
	pop.close_mc.addEventListener(MouseEvent.MOUSE_DOWN,closePopUp);
}

function closePopUp(evt:MouseEvent):void
{
	removeChild(pop);
	pop=null;
	removeChild(film_mc);
	film_mc=null;
}

Analizziamo il codice.

Abbiamo 4 funzioni:

1. openPopUp: questa funzione viene chiamata appena il bottone POPUP viene cliccato e a sua volta chiama altre 2 funzioni ( createFilm e attachPopUp ).


2. createFilm: questa funzione crea una MovieClip, disegna un rettangolo grande quanto lo stage con una trasperenza dello 0.5 ( 50% ) e di colore bianco.


3. attachPopUp: è l' ex attachMovie della versione 2 di Actionscript. In libreria ho una MovieClip (mc_pop) che non è altro che una finestra ed è associata ad una classe che ho chiamatp PopUp.
   
   Poi aggiungo un listener sul MOUSE_DOWN del bottone chiudi di questa MovieClip. Al click chiuderà la finestra chiamando la funzione closePopUp.


4. closePopUp: questa funzione rimuove la MovieClip creata nella funzione createFilm e rimuove la finestra ( PopUp ).

Esempio 2:

con relativo codice:

var film_mc:MovieClip;
var pop:PopUp;

container_mc.pop_btn.addEventListener(MouseEvent.MOUSE_DOWN,openPopUp);

function openPopUp(evt:MouseEvent):void
{
	applyBlur();
	createFilm();
	attachPopUp();
}

function createFilm():void
{
	film_mc=new MovieClip();
	film_mc.graphics.beginFill(0xFFFFFF,1);
	film_mc.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
	film_mc.alpha=0.3;
	addChild(film_mc);
}

function applyBlur():void
{
	var blurX:Number=3;
	var blurY:Number=3;
	var filter_array:Array=new Array();
	var blur:BlurFilter=new BlurFilter(blurX,blurY,BitmapFilterQuality.HIGH);
	filter_array.push(blur);
	container_mc.filters=filter_array;
}

function attachPopUp():void
{
	pop=new PopUp();
	pop.x=stage.stageWidth/2-pop.width/2;
	pop.y=stage.stageHeight/2-pop.height/2;
	addChild(pop);
	
	pop.close_mc.mouseChildren=false;
	pop.close_mc.buttonMode=true;
	pop.close_mc.addEventListener(MouseEvent.MOUSE_DOWN,closePopUp);
}

function closePopUp(evt:MouseEvent):void
{
	removeChild(pop);
	pop=null;
	removeChild(film_mc);
	film_mc=null;
	container_mc.filters=[];
}

Stessa logica del primo esempio, a differenza del fatto che in questo caso abbiamo una funzione in più: applyBlur che non fa altro che applicare un BlurFilter alla MovieClip contenitore.

Allego i files:

[Onsitus]

Bello questo tutorial...fa effetto tipo Lighbox. Mi piace!

[demonio78]

bella flep :D mi piace

ps: ma ti sono arrivate le mie mail dei tutorial interpolazione in flash?
fammi sapere

ciao wal

[Flep]

Ciao

Non mi sono arrivate

[demonio78]

allora mi sa che ho sbagliato mail
io ho fatto un reply alla prima mail mandata

mi ridai l'email così te lo spedisco vedi se va bene?
ti rido ancvhe la mia
demonio78[NO SPAM]hotmail.com

ciao walter

[Onsitus]

Originally Posted by demonio78

allora mi sa che ho sbagliato mail
io ho fatto un reply alla prima mail mandata

mi ridai l'email così te lo spedisco vedi se va bene?
ti rido ancvhe la mia
demonio78[no spam]hotmail.com

ciao walter

Ciao Demonio,

ti consiglio di mandare un mp a Flep visto che lui non legge tutti i post. Prima ti ha risposto perche li avevo puntato personalmente il tuo post in privato!

PS: ho editato la tua email per evitare che cade in un giro di spamming

[Flep]

Ti ho inviato un messaggio privato

[Onsitus]

Originally Posted by Flep

Ti ho inviato un messaggio privato

Bravo Flep...ti porterò personalmente il tuo premio per buon comportamento.

[demonio78]

ehmmmmmmmmmm....
nn ce la posso fà.....
ahuahuauhuahahuaahu
nn me so arrivate mail flep auhahuahuahuauhahu
questo tutorial non ce l'avrai mai ahahahuahuahuahuuhahuahua

dimmi a quale mail te devo invià i file...
VOGLIO ANDA' IN FERIEEEEEEEEEEEEEEE

se no se usi messenger è lo stesso della mail

BELLA
wal

[demonio78]

scusa flep ti è arrivato il mio messaggio privato?