Share
In deze Snelle tip maken we een presentatie op volledig scherm met Flash.
Maak een nieuw Flash-bestand en sla op als Presentation.fla. Stel in het eigenschappenvenster de grootte in die overeenkomt met de instellingen van de schermgrootte. Een standaard laptop WXGA-scherm is bijvoorbeeld 1280 x 800 pixels. Als u een presentatiebestand wilt leveren aan iemand die de Flash Player niet op hun computer heeft geïnstalleerd, selecteert u de Windows- en / of Macintosh-projecterdozen in het paneel Publicatie-instellingen..
Maak een nieuw .as-bestand - "Presentation.as" - om de documentklasse te zijn (raadpleeg deze Quick Tip voor meer informatie over documentklassen).
pakket import flash.display.MovieClip; public class Presentation breidt MovieClip uit public function Presentation ()
Om over te schakelen naar de modus Volledig scherm, moeten we de status van de fase weergeven wijzigen. Voeg een nieuwe toe importeren verklaring boven de klassenverklaring voor StageDisplayState.
import flash.display.StageDisplayState;
Onder normale omstandigheden vereist Flash dat de volledig-schermmodus wordt gestart door MouseEvent, maar bij het bekijken van een swf buiten een browser (projectormodus) is dit geen probleem. Om toch veilig te zijn (en in het geval dat u uw presentatie online wilt plaatsen), gebruiken we een try / catch-verklaring om de beveiligingsfout te bevatten die zou worden gegenereerd.
public function Presentation () public function Presentation () try stage.displayState = StageDisplayState.FULL_SCREEN; catch (err: SecurityError) // Moet in de projectormodus zijn voor weergave op volledig scherm
Als u de swf publiceert en opent, ziet u dat deze direct in de modus Volledig scherm wordt gestart (druk op ESC om af te sluiten).
Onze presentatie werkt door vooruit en achteruit te gaan door de tijdlijn. Flash heeft geen methode om de tijdlijn in omgekeerde volgorde af te spelen, dus moeten we onze tijdlijn creëren met behulp van een timer om de afspeelkop door de frames op de tijdlijn te verplaatsen. Eerst importeren we het timer en TimerEvent klassen.
import flash.events.TimerEvent; import flash.utils.Timer;
Vervolgens verklaren we de klasse vars voor de timer en ook een Boolean voor het bijhouden van de afspeelrichting.
private var isPlayingForward: Boolean; private var timelineTimer: Timer;
Vervolgens stellen we in de constructor van de klasse de waarden voor deze klasse vars in. We geven de timer een vertraging die gelijk is aan de framesnelheid die is ingesteld in de documenteigenschappen.
isPlayingForward = true; timelineTimer = nieuwe Timer (1000 / stage.frameRate); timelineTimer.addEventListener (TimerEvent.TIMER, timelineTimerHandler);
Als laatste hebben we de gebeurtenishandler voor de timer ingesteld.
private function timelineTimerHandler (te: TimerEvent): void if (isPlayingForward) this.nextFrame (); else this.prevFrame ();
In deze stap zullen we drie eenvoudige methoden creëren om de beweging langs de tijdlijn te sturen. Een voor stop, een voor afspelen en een andere om achteruit te spelen.
public function stopTimeline (): void stop (); timelineTimer.stop (); openbare functie playForward (): void isPlayingForward = true; timelineTimer.start (); public function playReverse (): void isPlayingForward = false; timelineTimer.start ();
Het toetsenbord wordt gebruikt om dia's in onze presentatie te wijzigen, dus we moeten de toetsenbordgebeurtenissen en luisteraars instellen. Nogmaals, we importeren enkele klassen.
import flash.events.KeyboardEvent; import flash.ui.Keyboard;
Voeg vervolgens de KeyboardEvent-luisteraar toe aan het podium.
stage.addEventListener (KeyboardEvent.KEY_DOWN, keyboardHandler);
Als laatste maakt u een methode om de KeyboardEvent te verwerken.
private function keyboardHandler (event: KeyboardEvent): void if (event.keyCode == Keyboard.RIGHT) playForward (); if (event.keyCode == Keyboard.LEFT) playReverse ();
Nu gaan we verder met het bouwen van de tijdlijn. Bouw hiervoor eenvoudigweg enkele dia's en maak tijdlijnanimaties om ze over te zetten. Maak een actielaag en voeg voor elke dia toe stopTimeline (); naar een keyframe. Uw tijdlijnpaneel zou er ongeveer zo uit moeten zien:
Naast het maken van diaovergangen op de tijdlijn, kunnen we ook ActionScript gebruiken. In dit voorbeeld zullen we TextAnimMaker en Greensocks TweenLite gebruiken. Als u deze ActionScript-bibliotheken wilt downloaden, gaat u naar Google Code for TextAnimMaker en GreenSock voor TweenLite. Nadat u de bestanden hebt gedownload, neemt u beide GreenSock en flupie mappen van hun persoon com mappen en kopieer ze in een com map in uw projectmap.
Vervolgens importeren we deze codebibliotheken in onze hoofddocumentklasse, zodat ze beschikbaar zijn voor gebruik op de tijdlijn.
import com.greensock.TweenLite; import com.greensock.easing. *; import com.flupie.textanim. *;
Maak een nieuwe MovieClip en voeg deze toe aan het werkgebied. Geef het een instantienaam van slideTextAnimation. Maak binnen de MovieClip een dynamisch tekstveld met wat tekst erin en geef het een instantienaam van slideText. Voeg nu het onderstaande script toe in de laag met acties op de tijdlijn.
stopTimeline (); var slideAnimateIn: TextAnim = new TextAnim (slideTextAnimation.slideText); slideAnimateIn.mode = TextAnimMode.RANDOM; slideAnimateIn.interval = 20; slideAnimateIn.blocksVisible = false; slideAnimateIn.effects = growEffect; slideAnimateIn.start (); functie growEffect (block: TextAnimBlock): void TweenLite.from (block, 1, scaleX: 0, scaleY: 0, ease: Elastic.easeOut);
Dit zorgt voor een leuk effect waarbij elke letter op het podium wordt geanimeerd. Raadpleeg deze QuickTip voor meer informatie over TextAnimMaker.
Sluit de presentatie af door het animatiescherm te animeren slideTextAnimation MovieClip van het podium en het invullen van de tijdlijn met de rest van uw dia's. Misschien wilt u misschien wat 3D-bewegings-tweening of meer coole overgangen proberen met TextAnimMaker en TweenLite.
Bedankt voor het lezen van deze snelle tip en ik hoop dat je volgende presentatie er één is die iedereen weg zal blazen met zijn flitsende grootsheid!
Accentsconagua