Sfat rapid prezentarea cronologică pe ecran complet

În acest sfat rapid vom crea o prezentare de diapozitive cu ecran complet cu Flash.


Pasul 1: Configurați fișierul Flash

Creați un nou fișier Flash și salvați ca Presentation.fla. În panoul Proprietăți, setați dimensiunea pentru a se potrivi cu setările dimensiunii ecranului afișat. De exemplu, un ecran laptop WXGA standard este de 1280 x 800 pixeli. Pentru a livra un fișier de prezentare unei persoane care nu are instalat flash player-ul pe aparatul său, selectați casetele Proiector Windows și / sau Macintosh din panoul Setări publicare.


Pasul 2: Configurați Clasa de documente principale

Creați un nou fișier .as - "Presentation.as" - a fi clasa de documente (consultați acest sfat rapid pentru mai multe despre clasele de documente).

 pachet import flash.display.MovieClip; public class Presentation extinde MovieClip public function Presentation () 

Pasul 3: Accesați ecranul complet

Pentru a comuta la modul ecran complet, trebuie să schimbăm starea de afișare a scenei. Adăugați un mesaj nou import declarație de mai sus declarația de clasă pentru StageDisplayState.

 import flash.display.StageDisplayState;

În condiții normale, Flash necesită un mod pe ecran complet pe care să îl inițieze MouseEvent, dar atunci când vizualizați un SWF în afara unui browser (modul proiector), aceasta nu este o problemă. Totuși, doar pentru a fi siguri (și în cazul în care doriți să puneți prezentarea dvs. online), vom folosi o instrucțiune try / catch pentru a conține eroarea de securitate care ar fi aruncată.

 funcția publică () public function Presentation () try stage.displayState = StageDisplayState.FULL_SCREEN;  captură (err: SecurityError) // Trebuie să fie în modul proiector pentru vizionarea pe tot ecranul

Dacă publicați și deschideți swf-ul, veți vedea că acesta se lansează direct în modul ecran complet (apăsați ESC pentru a ieși).


Pasul 4: Creați cronometrul pentru Playhead

Prezentarea noastră va funcționa prin trecerea înainte și înapoi prin cronologie. Flash nu are o metodă de redare a cronologiei în sens invers, așa că va trebui să ne creăm propriul cu ajutorul unui cronometru pentru a mișca capul de joc prin cadrele de pe cronologie. În primul rând, importăm Cronometrul și TimerEvent clase.

 import flash.events.TimerEvent; import flash.utils.Timer;

Apoi, declarăm clasa Vars pentru timer și un Boolean pentru a urmări direcția de redare.

 private var isPlayingForward: Boolean; privat var timelineTimer: Timer;

Apoi, în constructorul de clasă, setăm valorile pentru aceste clase de vars. Oferim timerului o întârziere egală cu rata de cadre stabilită în proprietățile documentului.

 isPlayingForward = true; TimelineTimer = Timer nou (1000 / stage.frameRate); timelineTimer.addEventListener (TimerEvent.TIMER, timelineTimerHandler);

În cele din urmă, am creat procedura de tratare a evenimentului pentru cronometru.

 funcția privată timelineTimerHandler (te: TimerEvent): void if (isPlayingForward) this.nextFrame (); altfel this.prevFrame (); 

Pasul 5: Creați metode de control al liniei temporale

În acest pas, vom crea trei metode simple pentru a controla mișcarea de-a lungul liniei temporale. Unul pentru oprire, unul pentru redare și altul pentru a juca în sens invers.

 funcția publică stopTimeline (): void stop (); timelineTimer.stop ();  funcția publică funcțiaForward (): void isPlayingForward = true; timelineTimer.start ();  funcția publică funcția Reverse (): void isPlayingForward = false; timelineTimer.start (); 

Pasul 6: Configurați ascultarea tastaturii

Tastatura va fi utilizată pentru a schimba diapozitivele în prezentarea noastră, așa că trebuie să setăm evenimentele și ascultătorii de la tastatură. Încă o dată, importăm câteva clase.

 import flash.events.KeyboardEvent; import flash.ui.Keyboard;

Apoi, adăugați ascultătorul KeyboardEvent pe scenă.

 stage.addEventListener (tastaturăEvent.KEY_DOWN, keyboardHandler);

În cele din urmă, creați o metodă pentru a gestiona KeyboardEvent.

 funcția privată keyboardHandler (eveniment: KeyboardEvent): void if (event.keyCode == Keyboard.RIGHT) playForward (); dacă (event.keyCode == Keyboard.LEFT) playReverse (); 

Pasul 7: Construiți diapozitivele

Acum mergem la construirea cronologiei. Pentru aceasta, construiți pur și simplu niște diapozitive și creați animații cronologice pentru a trece între ele. Creați un strat de acțiuni și adăugați, pentru fiecare diapozitiv stopTimeline (); la un cadru cheie. Panoul dvs. de timp ar trebui să arate astfel:


Pasul 8: Creați tranziții de diapozitive cu cod

În plus față de construirea tranzițiilor de diapozitive pe cronologie, putem folosi și ActionScript. În acest exemplu, vom folosi TextAnimMaker și TweenLite de la Greensock. Pentru a descărca aceste biblioteci ActionScript, mergeți la Google Code for TextAnimMaker și GreenSock pentru TweenLite. Odată ce ați descărcat fișierele, apucați ambele GreenSock și flupie directoare de la persoana lor com directoare și copiați-le într-una com director în dosarul proiectului.

Apoi, vom importa aceste biblioteci de coduri în clasa principală a documentelor, astfel încât acestea să fie disponibile pentru ca noi să putem folosi pe cronologie.

 import com.greensock.TweenLite; import com.greensock.easing. *; import com.flupie.textanim. *;

Creați un nou videoclip și adăugați-l pe scenă. Dați-i un nume de instanță slideTextAnimation. În interiorul MovieClip, creați un TextField dinamic cu un text interior și dați-i un nume de instanță slideText. Acum, în stratul de acțiuni de pe cronologie, adăugați scriptul de mai jos.

 stopTimeline (); var slideAnimateIn: TextAnim = text nou TextAnim (slideTextAnimation.slideText); slideAnimateIn.mode = TextAnimMode.RANDOM; slideAnimateIn.interval = 20; slideAnimateIn.blocksVisible = false; slideAnimateIn.effects = growEffect; slideAnimateIn.start (); funcția growEffect (bloc: TextAnimBlock): void TweenLite.from (bloc, 1, scaleX: 0, scaleY: 0, ușurință: Elastic.easeOut); 

Acest lucru va crea un efect distractiv în care fiecare literă este animată pe scenă. Pentru mai multe informații despre TextAnimMaker, consultați acest QuickTip.


Pasul 9: Marea finisare

Înfășurați prezentarea animând slideTextAnimation FilmClip de pe scenă și completați cronologia cu restul diapozitivelor. Poate că ați dori să încercați câteva mișcări de mișcare 3D sau mai multe tranziții reci cu TextAnimMaker și TweenLite.

Vă mulțumim că ați citit acest sfat rapid și sper că următoarea dvs. prezentare va fi cea care va arunca toată lumea departe cu măreția sa strălucitoare!

Cod