Acest tutorial descrie cum sa realizezi o animatie Flash simpla utilizand Adobe Flash CS3 (pentru exemplul bazat pe Flash CS4 exista acest post, Cum sa realizezi o animatie bazata pe miscare in Flash CS4, deoarece exista o serie de diferente minore la nivel de interfata). In acest exemplu se va realiza o animatie ce utilizeaza efecte Flash de tip motion tween pentru a misca un obiect pe ecran dupa o traiectorie liniara. Ceva de genul acesta:
[kml_flashembed publishmethod=”static” fversion=”9.0.0″ movie=”http://www.itcsolutions.eu/wp-content/uploads/2009/12/SquareAnimation.swf” width=”400″ height=”100″ targetclass=”flashmovie” play=”true” loop=”true” menu=”true”]
[/kml_flashembed]
Pentru a intelege acest exemplu si conceptele de baza din Adobe Flash CS3, folosite pentru a realiza animatia, poate fi citit post-ul Adobe Flash CS3 and CS4 interface, basic commands and concepts
Pentru a realiza animatia:
1. Se creeaza un nou proiect Flash (Flash File ActionScript 2.0 sau 3.0) alegand File -> New (Ctrl + N) din meniul aplicatiei
2. Se redenumeste layer-ul implicit (Dublu-Click cu mouse-ul pe numele imlicit a layer-ului Layer 1) cu un nou nume, Background
3. Pentru a separa obiectul animat de layer-ul pentru fundal se construieste un nou layer (din meniul aplicatiei Insert ->Timeline -> Layer), numit Square
4. Pe noul layer, numit Square, se deseneaza un dreptunghi (pentru a desena un patrat, se tine apasata tasta Shift) cu colturi rotunjite; dreptunghiul / patratul se deseneaza utilizand Rectangle Tool din Toolbar; inainte de a desena obiectul, se selecteaza Rectangle Tool si se stabileste culoarea (pentru margine, Stroke Color, nu se pune culoare) acestuia, precum si unghiul colturilor; toate aceste setari sunt realizate din Property Inspector
5. Se creeaza un keyframe (cadru cheie) la frame-ul 30 pe layer-ul Square (se selecteaza cadrul 30 si se apasa F6; pentru alte posibilitati de a crea cadre cheie – Adobe Flash CS3 and CS4 interface, basic commands and concepts); aceasta actiune va multiplica primul cadru cheie peste urmatoarele 30 de cadre si va crea un nou cadru cheie la sfarsit;
6. Se creeaza un efect de tip Motion Tween pe layer-ul Square intre cadrele cheie 1 si 30 (daca nu se stie cum se aplica un astfel de efect – Adobe Flash CS3 and CS4 interface, basic commands and concepts)
7. Se selecteaza primul keyframe (cadru cheie) de pe layer-ul Square si folosind Selection Tool se defineste pozitia de start a obiectului de pe scena
8. Se selecteaza al doilea keyframe (cadru cheie) de pe layer-ul Square si folosind Selection Tool se defineste pozitia finala a obiectului de pe scena
9 Se testeaza animatia utilizand Ctrl+ Enter (pentru Windows)
Pentru a intelege exemplul, puteti viziona si versiunea video a acestui tutorial:
[kml_flashembed publishmethod=”static” fversion=”9.0.0″ movie=”http://www.acs.ase.ro/multimedia/SuportFlash/AnimationFlashMovie.swf” width=”550″ height=”400″ targetclass=”flashmovie” play=”true” loop=”true”]
[/kml_flashembed]