Proprietà Z Flash CS4

« Older   Newer »
  Share  
~sanbombo92
view post Posted on 14/4/2009, 21:49     +1   -1




Abbiamo visto che la classe MovieClip di Flash CS4 ha la nuova proprietà z.

Adesso guardiamo un esempio pratico sul quale applicare appunto questo effetto-sensazione di tridimensionale.

In questo tutorial vedremo come applicare l' asse Z a delle immagini che se cliccate si scambiano la prospettiva tra di loro.

Creo un FLA che salvo con nome "main.fla" .

Creo una MovieClip con all' interno uno sfondo colorato quadrato.

Importo una immagine quadrata nella libreria di Flash e la colloco all' interno della MovieClip ( che naturalmente risiede sullo stage ).

Creo altre 2 istanze della stessa MovieClip ed assegno loro i nomi istanza: clip_0_mc, clip_1_mc, clip_2_mc .

Adesso creo la Document Class, un file AS che salvo sempre nella stessa directory in cui si trova main.fla .

La Document Class è implementata in questo modo...
CODICE
package
{
       import flash.display.*;
       import flash.events.*;
       import caurina.transitions.Tweener;
       
       public class Main extends MovieClip
       {
               private var clips_array:Array;
               
               public function Main()
               {
                       addEventListener(Event.ADDED_TO_STAGE,init);
               }
               
               private function init(evt:Event):void
               {
                       removeEventListener(Event.ADDED_TO_STAGE,init);
                       
                       stage.frameRate=31;
                       
                       clips_array=new Array(clip_0_mc,clip_1_mc,clip_2_mc);
                       for(var i:int=0;i < clips_array.length;i++)
                       {
                               clips_array[i].id=i;
                               
                               clips_array[i].z=400;
                       }
                       
                       addListenersToClips();
               }
               
               private function addListenersToClips():void
               {
                       for(var i:int=0;i < clips_array.length;i++)
                       {
                               clips_array[i].mouseChildren=false;
                               clips_array[i].buttonMode=true;
                               clips_array[i].addEventListener(MouseEvent.MOUSE_DOWN,onDown);
                       }
               }
               
               private function onDown(evt:MouseEvent):void
               {
                       for(var i:int=0;i < clips_array.length;i++)
                       {
                               if(i==evt.target.id)
                               {
                                       evt.target.buttonMode=false;
                                       this.setChildIndex(evt.target as MovieClip,this.numChildren-1);
                                       Tweener.addTween(evt.target,{z:0,time:.3,transition:"linear"});
                               }
                               else
                               {
                                       clips_array[i].buttonMode=true;
                                       Tweener.addTween(clips_array[i],{z:400,time:.3,transition:"linear"});
                               }
                       }
                       
               }
       }
}



clicca sui quadratini e fara un effetto zoom...


Analizziamo il codice



Importo le classi necessarie ( in questo esempio viene usata la Tweener caurina, per chi non la conoscesse consiglio di leggere i seguenti tutorials:


http://www.flepstudio.org/forum/articoli-e-tutorials/1057-tweener-caurina-di-zeh-fernando-tutorial-1-a.html


http://blog.flepstudio.org/tutorials/tween...ando-esempio-2/ )


import flash.display.*;


import flash.events.*;



import caurina.transitions.Tweener;



Inserisco le MovieClip in un Array, gli assegno un ID e gli imposto la proprietà Z:


clips_array=new Array(clip_0_mc,clip_1_mc,clip_2_mc);


for(var i:int=0;i < clips_array.length;i++)


{


clips_array[i].id=i;





clips_array[i].z=400;



}



chiamo la funzione addListenersToClips, che aggiunge i listeners in ascolto del MOUSE_DOWN sulle 3 MovieClip


for(var i:int=0;i < clips_array.length;i++)


{


clips_array[i].mouseChildren=false;


clips_array[i].buttonMode=true;


clips_array[i].addEventListener(MouseEvent.MOUSE_DOWN,onDown);



}



Nel Metodo onDown, che viene chiamato quando una delle MovieClip è cliccata, scambio i livelli delle MovieClip in modo che quella selezionata sia sempre al più alto. Tolgo la manina del mouse alla MovieClip selezionata ed applico la Tween sulle assi Z delle MovieClip


for(var i:int=0;i < clips_array.length;i++)


{


if(i==evt.target.id)


{


evt.target.buttonMode=false;



this.setChildIndex(evt.target as MovieClip,this.numChildren-1);


Tweener.addTween(evt.target,{z:0,time:.3,transitio n:"linear"});


}


else


{


clips_array[i].buttonMode=true;


Tweener.addTween(clips_array[i],{z:400,time:.3,transition:"linear"});



}


}




FONTE: http://www.flepstudio.org/forum/cs4-artico...sempio-2-a.html
 
Top
0 replies since 14/4/2009, 21:49   58 views
  Share