ActionScript 3: Klasses, de basis
In deze tutorial zal ik de basis van het werken van klasses met ActionScript 3 uitleggen.
In deze tutorial maak ik gebruik van Adobe Flash CS3 Professional.
Aanvullingen, verbeteringen, opmerkingen of wat dan ook zijn altijd welkom.
1. Wat is ActionScript3
2. Documenten aanmaken
3. ActionScript bestand
4. Flashbestand
5. Enkele handige standaardklasses
6. Zelf klasses maken
7. Access Modifiers
1. Wat is ActionScript3 + Basis
ActionScript 3 is de nieuwe scripttaal van (Adobe) Flash. ActionScript is afgeleid van ECMAScript en is een objectgeoriënteerde scripttaal.
Definiëren variabelen
een variabele definieer je ofwel globaal (voor gans de klasse) ofwel in een functie. Bij globale variabelen kun je acces modifiers gebruiken.
Een variabele definieer je door "var" + naam variabele + :(dubbelpunt) + type te plaatsen.
Om bij voorbeeld een integer(32-bits geheel getal) te definiëren zet je
var integer:int
Functies
Ook bij functies kun je acces modifiers gebruiken (de constructor mag niet op private staan, ook niet bij het singleton design pattern)
Een functie schrijf je door "function " + naam functie + "(" + parameters + "):" + objecttype dat gereturnd word te plaatsen(wanneer een functie niets returnd plaats je :void). Enkel wanneer een functie de constructor is van een klasse (functie met zelfde naam als klasse) zet je bij de waarde die gereturnd word niets (ook geen dubbele punt)
 top
2. Documenten aanmaken
Eerst maken we een nieuw flashbestand aan(Bestand->Nieuw->Flash Bestand(ActionScript3)).
Zeer belangrijk dat het een ActionScript3 bestand is.
Sla dit op als bijvoorbeeld Main.fla.
Nu maken we een ActionScript bestand aan (Bestand->Nieuw->ActionScript Bestand).
Sla dit bestand op in een map die in dezelfde map staat als Main.fla (noem de map bv classes en het ActionScriptbestand Main.as).
top
3. Actionscript bestand
Eerst definiëren we de package van de klasse, dit is de naam van de map waarin het bestand staat, zet je het bestand nog een niveau lager bv in de map classes in een map test1 dan noemt de package classes.test1
Nu definiëren we de klasse (Main) deze laten we extenden van de klasse MovieClip omdat Main.fla een movieclip object is. Doordat de klasse MovieClip niet automatisch ingevoegd word moeten we deze nog importeren door "import flash.display.MovieClip toe te voegen.
package classes{
import flash.display.MovieClip
public class Main extends MovieClip {
}
}
Nu maken we een constructor aan, dit is een functie die dezelfde naam heeft als de klasse + er word niet gedefinieerd wat er gereturnd word.
We plaatsen er een trace functie in om te testen of de klasse werkt.
package classes{
import flash.display.MovieClip
public class Main extends MovieClip {
public function Main() {
trace("Main klasse");
}
}
}
top
4. Flashbestand
Nu moeten we instellen dat het flashbestand onze klasse als klasse gebruikt.
Klik op de tab van Main.fla(zodat we het flashbestand bewerken)
Nu gaan we via Bestand->Publicatie Instellingen naar het venster voor de publicatie instellingen.
Zorg dat flash aangevinkt staat(standaard is dit zo) en open het tabblad flash. Klik nu naast ActionScript-versie (waar ActionScript3) moet staan op instellingen.
Je krijgt nu een popup om de instellingen van ActionScript te wijzigen.
Vul bij documentklasse 'classes.main' in, met andere woorden de packagenaam + .(dot) + klassenaam.
Door op het groene vinkje naast dit veld te klikken kun je controleren of de klasse gevonden kan worden.
Druk je erop en is alles juist krijg je een melding "Definitie voor de klasse gevonden in 'map'"
Druk op ok en bij Publicatie Instellingen ook op ok.
Druk nu op Ctrl + Enter of Besturing->Film testen.
Nu zou je in het Uitvoervenster moeten zien staan wat je in de trace gezet hebt.
Gebeurt dit niet maar zie je geen foutmelding dan word het ActionScript bestand niet gebruikt als klasses.
Krijg je een foutmelding heb je waarschijnlijk iets mistypt.
top
5. Enkele handige standaardklasses
(klasses importeren via import klassepad)
flash.display.Sprite
De klasse Sprite is een basisbouwsteen voor weergaveoverzichten: een weergaveoverzichtnode die afbeeldingen kan weergeven en onderliggende objecten kan bevatten.
Een object Sprite lijkt op een filmclip, maar heeft geen tijdlijn. Sprite is een geschikte basisklasse voor objecten die geen tijdlijn vereisen.
Sprite zou bijvoorbeeld een logische basisklasse zijn voor componenten van een gebruikersinterface die gewoonlijk geen tijdlijn gebruiken.
flash.display.MovieClip
In tegenstelling tot het object Sprite, heeft het object MovieClip een tijdlijn.
De methoden voor de klasse MovieClip bieden dezelfde functionaliteit als handelingen voor filmclips.
flash.events.(event)
flash.events bevat alle events die je kunt gebruiken in flash (je kunt er ook zelf aanmaken, over het gebruik en aanmaken van events maak nog een tutorial)
flash.utils.Timer
De klasse Timer is de interface voor Flash Player-timers. U kunt nieuwe objecten Timer maken om code op een opgegeven tijdreeks te laten uitvoeren.
Gebruik de methode start() om een timer te starten. Voeg een gebeurtenislistener toe voor de gebeurtenis timer om code in te stellen die moet worden uitgevoerd op de timerinterval.
top
6. Zelf klasses maken
Om zelf een klasse te maken doen we net als we Main.as aangemaakt hebben.
Hier een voorbeeld van hoe je een klasse Persoon zou kunnen maken.
package classes{
public class Persoon{
public var naam:String
public var leeftijd:int
public function Persoon(naam:String,leeftijd:int) {
this.naam = naam
this.leeftijd = leeftijd
}
}
}
Hier zie je dat ik in de constructor 2 properties meegegeven heb, namelijk de naam en de leeftijd van de persoon.
Om nu een nieuwe persoon te gebruiken in de mainklasse definieren we een nieuwe persoon via "var persoon:Persoon = new Persoon('Echron',21)"
Importeren van de klasse is niet nodig omdat deze zich in dezelfde package bevind.
Wanneer we nu iets uit onze library willen gebruiken om deze persoon visueel op onze stage te plaatsen doen we bijvoorbeeld volgende:
Maak een filmclip aan in Main.fla en noem deze Persoon.
Voeg hierin een afbeelding van een ventje.
Ga nu naar de eigenschappen van deze clip via de rechtermuis op de clip in de librairy ->Eigenschappen. Vink "Exporteren voor ActionScript" aan. Vul naast klasse het klassepad in naar de klasse Persoon "classes.Persoon". Als basisklasse vullen we "flash.display.Sprite" in omdat we hier geen tijdlijn nodig hebben (meer uitleg hier).
Druk op ok. Nu moeten we wel onze klasse Persoon laten extenden van flash.display.Sprite.
Om dit te kunnen doen moeten we ook flash.display.Sprite importeren.
De klasse ziet er nu zo uit:
package classes{
import flash.display.Sprite
public class Persoon extends Sprite{
public var naam:String
public var leeftijd:int
public function Persoon(naam:String,leeftijd:int) {
this.naam = naam
this.leeftijd = leeftijd
}
}
}
Om onze klasse nu zichtbaar te maken op de stage moeten we onze persoon nog op de stage zetten, dit doen we via "addChild(persoon") in Main.as toe te voegen.
Ook stellen we de x en y-waarden in van ons object. Deze worden overgeërfd van de klasse Sprite.
Main.as ziet er nu zo uit:
package classes{
import flash.display.MovieClip
public class Main extends MovieClip {
public function Main() {
var persoon:Persoon = new Persoon('Echron',21);
addChild(persoon);
persoon.x = 200
persoon.y = 200
}
}
}
Als extra zouden we nu kunnen zorgen dat we ons "ventje" zouden kunnen verslepen, daar zal ik voor zorgen in mijn volgende tutorial die gaat over events in flash.
top
7. Acces Modifiers
Hier beschrijf ik zeer kort de standaard acces modifiers, deze komen overeen met acces modifiers uit andere programmeertalen dus ga ik er niet veel uitleg bij doen.
Public
De public modifier zorg ervoor dat alle klasses aan de functies/variabelen kunnen.
Private
De private modifier zorgt ervoor dat er buiten de klasse niemand aan deze variabele kan of dat deze functie niet kan opgeroepen worden.
Protected
De protected modifier zorgt ervoor dat enkel subklasses (inherithed) aan deze functies/variabelen kunnen.
top
Opmerkingen, verbeteringen, aanvullingen of wat dan ook zijn altijd welkom.
|
Wat is jouw favoriete javascript framework? (S: 18, R: 2)
