|
Het voorbeeld Algorithmic Visual Generator tekent dynamisch verschillende 'satellieten' of cirkels die in een cirkelvormige baan bewegen in het werkgebied. De volgende functies worden behandeld:
-
De teken-API gebruiken om een basisvorm te tekenen met een dynamisch uiterlijk.
-
Gebruikersinteractie koppelen aan de eigenschappen die in een tekening worden gebruikt.
-
Animatie overbrengen door het werkgebied op elk frame te wissen en opnieuw te tekenen.
In het voorbeeld in de vorige subsectie werd één 'satelliet' bewegend gemaakt met de gebeurtenis
Event.ENTER_FRAME
. Dit wordt hier uitgebreid door een bedieningspaneel te maken met een reeks schuifregelaars die de visuele weergave van verschillende satellieten direct bijwerken. In dit voorbeeld wordt de code in externe klassen geformaliseerd en wordt de code voor het maken van de satelliet in een lus geplaatst, waarbij een verwijzing naar elke satelliet in een array
satellites
wordt opgeslagen.
Zie
www.adobe.com/go/learn_programmingAS3samples_flash_nl
als u de toepassingsbestanden voor dit voorbeeld wilt downloaden. De toepassingsbestanden vindt u in de map Samples/AlgorithmicVisualGenerator. In deze map staan de volgende bestanden:
|
Bestand
|
Beschrijving
|
|
AlgorithmicVisualGenerator.fla
|
Het hoofdtoepassingsbestand in Flash Professional (FLA).
|
|
com/example/programmingas3/algorithmic/AlgorithmicVisualGenerator.as
|
De klasse met de hoofdfunctionaliteit van de toepassing, inclusief het tekenen van satellieten in het werkgebied en het reageren op gebeurtenissen van het bedieningspaneel zodat de variabelen worden bijgewerkt die effect hebben op het tekenen van satellieten.
|
|
com/example/programmingas3/algorithmic/ControlPanel.as
|
Een klasse die de gebruikersinteractie beheert met verschillende schuifregelaars en gebeurtenissen verzendt wanneer dergelijke interactie zich voordoet.
|
|
com/example/programmingas3/algorithmic/Satellite.as
|
Een klasse die staat voor het weergaveobject dat in een baan rond een centraal punt draait en dat eigenschappen bevat die betrekking hebben op de huidige tekenstatus.
|
Listeners instellen
De toepassing maakt eerst drie listeners. De eerste luistert naar een door het bedieningspaneel verzonden gebeurtenis die aangeeft dat de satellieten opnieuw moeten worden opgebouwd. De tweede luistert naar wijzigingen in de grootte van het werkgebied voor het SWF-bestand. De derde luistert naar elk doorgegeven frame in het SWF-bestand en gebruikt de functie
doEveryFrame()
om opnieuw te tekenen.
Satellieten maken
Wanneer deze luisteraars zijn ingesteld, wordt de functie
build()
aangeroepen. Deze functie roept eerst de functie
clear()
aan, die de array
satellites
leegt en eventuele eerdere tekenhandelingen in het werkgebied wist. Dit is nodig aangezien de functie
build()
opnieuw kan worden aangeroepen wanneer het bedieningspaneel hiervoor een gebeurtenis verzendt, bijvoorbeeld wanneer de kleurinstellingen zijn gewijzigd. In dat geval moeten de satellieten worden verwijderd en opnieuw gemaakt.
De functie maakt daarna de satellieten en stelt daarbij de eerste eigenschappen in die nodig zijn voor het maken ervan, zoals de variabele
position
, die op een willekeurige positie in de baan begint en de variabele
color
, die in dit voorbeeld niet meer wordt gewijzigd wanneer de satelliet is gemaakt.
Na het maken van elke satelliet, wordt een verwijzing naar de satelliet toegevoegd aan de array
satellites
. Wanneer de functie
doEveryFrame()
wordt aangeroepen, worden alle satellieten in deze array bijgewerkt.
Positie van de satellieten bijwerken
De functie
doEveryFrame()
is de kern van het animatieproces van de toepassing. Deze wordt voor elk frame aangeroepen, met een snelheid die gelijk staat aan de framesnelheid van het SWF-bestand. Omdat de variabelen voor het tekenen iets wijzigen, geeft dit het idee van een animatie.
De functie wist eerst alle eerdere tekenhandelingen en tekent de achtergrond opnieuw. Vervolgens loopt deze elke satellietcontainer door en wordt de eigenschap
position
van elke satelliet verhoogd. De eigenschappen
radius
en
orbitRadius
worden dan bijgewerkt omdat die mogelijk zijn gewijzigd door gebruikersinteractie met het bedieningspaneel. Ten slotte wordt de satelliet op de nieuwe positie ingesteld door de methode
draw()
van de klasse Satellite aan te roepen.
De teller
i
neemt alleen toe tot de variabele
visibleSatellites
. De reden hiervoor is dat wanneer de gebruiker het aantal satellieten heeft beperkt die via het bedieningspaneel worden weergegeven, de overige satellieten in de lus niet opnieuw hoeven te worden getekend, maar verborgen moeten worden. Dit gebeurt in een lus die onmiddellijk volgt op de lus die verantwoordelijk is voor het tekenen.
Wanneer de functie doEveryFrame() is voltooid, wordt het aantal
visibleSatellites
op hun nieuwe positie op het scherm ingesteld.
Reageren op gebruikersinteractie
Gebruikersinteractie doet zich voor via het bedieningspaneel, dat door de klasse ControlPanel wordt beheerd. Deze klasse stelt een listener in samen met de afzonderlijke minimale, maximale en standaardwaarden voor elke schuifregelaar. Wanneer de gebruiker deze schuifregelaars verplaatst, wordt de functie
changeSetting()
aangeroepen. Deze functie werkt de eigenschappen van het bedieningspaneel bij. Wanneer de weergave bij het wijzigen opnieuw moet worden opgebouwd, wordt een gebeurtenis verzonden die daarna in het hoofdtoepassingsbestand wordt verwerkt. Wanneer de instellingen van het bedieningspaneel worden gewijzigd, tekent de functie
doEveryFrame()
elke satelliet met de bijgewerkte variabelen.
Verdere aanpassingen
Dit voorbeeld is slechts een eenvoudig overzicht van hoe u visuele effecten kunt maken met behulp van de teken-API. Er worden relatief weinig coderegels gebruikt om een interactieve ervaring te maken die er ingewikkeld uitziet. Toch kan dit voorbeeld nog verder worden uitgebreid. Enkele ideeën:
-
De functie
doEveryFrame()
kan de kleurwaarde van de satelliet verhogen.
-
De functie
doEveryFrame()
kan de satellietradius gedurende een periode verkleinen of vergroten.
-
De satellietradius hoeft niet circulair te zijn; de klasse Math kan bijvoorbeeld worden gebruikt om volgens een sinusgolf te bewegen.
-
Satellieten kunnen aanraakdetectie met andere satellieten gebruiken.
De teken-API kan worden gebruikt als een alternatief voor het maken van visuele effecten in de Flash-ontwerpomgeving door basisvormen bij uitvoering te tekenen. Maar de teken-API kan ook worden gebruikt om visuele effecten te maken met een variatie en bereik die niet met de hand kunnen worden bereikt. Met de teken-API en een beetje wiskunde kan de ActionScript-ontwerper veel onverwachte creaties maken.
|
|
|
