ActionScript-voorbeelden gebruiken

Een van de beste manieren om te leren hoe bepaalde klassen en methoden werken, is het uitvoeren van een ActionScript 3.0-codevoorbeeld. U kunt de voorbeelden op verschillende manieren gebruiken, afhankelijk van de apparaten die u gebruikt of waarop u zich richt.

Computers met Flash Professional of Flash Builder
Zie ActionScript 3.0-voorbeelden uitvoeren in Flash Professional of ActionScript 3.0-voorbeelden uitvoeren in Flash Builder om te lezen hoe u deze ontwikkelomgevingen kunt gebruiken voor het uitvoeren van ActionScript 3.0-voorbeelden. Gebruik trace-instructies en andere tools voor foutopsporing om meer inzicht te krijgen in de manier waarop een codevoorbeeld functioneert.

Mobiele apparatuur
U kunt de ActionScript 3.0-codevoorbeelden uitvoeren op mobiele apparaten die ondersteuning bieden voor Flash Player 10.1 en later. Zie ActionScript 3.0-voorbeelden uitvoeren op mobiele apparaten. U kunt deze voorbeelden met gebruik van Flash Professional of Flash Builder ook uitvoeren op uw computer.

TV-apparaten
Hoewel u deze voorbeelden niet kunt uitvoeren op een televisie, kunt u er wel iets van opsteken door ze uit te voeren op uw computer. Zie Flash Platform for TV op de Adobe Developer Connection-website voor informatie over het ontwikkelen van toepassingen voor tv's.

Typen voorbeelden

De typen voorbeelden van ActionScript 3.0-code zijn:

Codefragmentvoorbeelden

Een codefragmentvoorbeeld ziet er als volgt uit:

var x:int = 5; 
trace(x); // 5

Codefragmenten bevatten code om één enkel idee te demonstreren. De fragmenten bevatten gewoonlijk geen pakket- of klasseninstructies.

Voorbeelden die zijn gebaseerd op een klasse

Veel voorbeelden tonen de broncode van een complete ActionScript-klasse. Een op een klasse gebaseerd voorbeeld ziet er als volgt uit:

package { 
    public class Example1 { 
        public function Example1():void { 
            var x:int = 5; 
            trace(x); //5 
        } 
    } 
}

De code voor een op een klasse gebaseerd voorbeeld bevat een pakketinstructie, een klassendeclaratie en een constructorfunctie.

Praktische voorbeelden met meerdere bronbestanden

Veel van de onderwerpen in de ActionScript 3.0-ontwikkelaarsgids bevatten realistische voorbeelden die laten zien hoe bepaalde ActionScript-functies in een praktische context kunnen worden gebruikt. Deze voorbeelden bevatten gewoonlijk meerdere bestanden, waaronder:

  • Een of meerdere ActionScript-bronbestanden

  • Een .FLA-bestand dat met Flash Professional kan worden gebruikt

  • Een of meerdere MXML-bestanden die met Flash Builder kunnen worden gebruikt

  • Gegevensbestanden, afbeeldingsbestanden, geluidsbestanden of andere elementen die door de voorbeeldtoepassing worden gebruikt (optioneel)

Praktische voorbeelden worden gewoonlijk als ZIP-archiefbestanden geleverd.

Lijst met voorbeelden uit de gids voor ontwikkelaars in het ZIP-bestand

Het ZIP-bestand voor Flash Professional CS5 en Flex 4 (te downloaden van www.adobe.com/go/learn_programmingAS3samples_flash_nl) bevat de volgende voorbeelden:

Praktische voorbeelden worden eveneens gebruikt in veel van de artikelen in het Flash Developer Center en het Flex Developer Center.

ActionScript 3.0-voorbeelden uitvoeren in Flash Professional

Volg een van de volgende procedures (afhankelijk van het type voorbeeld) om een voorbeeld uit te voeren met Flash Professional.

Een codefragmentvoorbeeld uitvoeren in Flash Professional

Een codefragmentvoorbeeld uitvoeren in Flash Professional:

  1. Selecteer Bestand > Nieuw.

  2. Selecteer Flash-document in het dialoogvenster Nieuw document en klik op OK.

    Er wordt een nieuw Flash-venster weergegeven.

  3. Klik in het deelvenster Tijdlijn op het eerste frame van de eerste laag.

  4. Typ of plak in het deelvenster Handelingen het codefragmentvoorbeeld.

  5. Selecteer Bestand > Opslaan. Geef het bestand een naam en klik op OK.

  6. Als u het voorbeeld wilt testen, selecteert u Besturing > Film testen.

Een op een klasse gebaseerd voorbeeld uitvoeren in Flash Professional

Een op een klasse gebaseerd voorbeeld uitvoeren in Flash Professional:

  1. Selecteer Bestand > Nieuw.

  2. Selecteer ActionScript-bestand in het dialoogvenster Nieuw document en klik op OK. Er wordt een nieuw editorvenster weergegeven.

  3. Kopieer de code voor het op een klasse gebaseerd voorbeeld en plak deze in het editorvenster.

    Als de klasse de hoofddocumentklasse voor het programma is, moet deze de klasse MovieClip uitbreiden:

    import flash.display.MovieClip; 
    public class Example1 extends MovieClip{ 
    //... 
    }

    Zorg er ook voor dat alle klassen waarnaar in het voorbeeld wordt verwezen, worden gedeclareerd aan de hand van import-instructies.

  4. Selecteer Bestand > Opslaan. Geef het bestand dezelfde naam als de klasse in het voorbeeld (bijvoorbeeld ContextMenuExample.as).
    Opmerking: Sommige van de op klassen gebaseerde voorbeelden, zoals het flashx.textLayout.container.ContainerController-klassenvoorbeeld, bevatten meerdere niveaus in de pakketdeclaratie (package flashx.textLayout.container.examples {). Sla voor deze voorbeelden het bestand op in een submap die overeenkomt met de pakketdeclaratie (flashx/textLayout/container/examples) of verwijder de pakketnaam (zodat ActionScript alleen begint met package { ). Op deze manier kunt u het bestand vanaf een willekeurige locatie testen.
  5. Selecteer Bestand > Nieuw.

  6. Selecteer in het dialoogvenster Nieuw document het type Flash-document (ActionScript 3.0) en klik op OK. Er wordt een nieuw Flash-venster weergegeven.

  7. Geef in het deelvenster Eigenschappen in het veld Documentklasse de naam van de voorbeeldklasse op. Deze naam moet identiek zijn aan de naam van het ActionScript-bronbestand dat u zojuist hebt opgeslagen (bijvoorbeeld ContextMenuExample).

  8. Selecteer Bestand > Opslaan. Geef het FLA-bestand dezelfde naam als de klasse in het voorbeeld (bijvoorbeeld ContextMenuExample.fla).

  9. Als u het voorbeeld wilt testen, selecteert u Besturing > Film testen.

Een praktisch voorbeeld uitvoeren in Flash Professional

Praktische voorbeelden worden gewoonlijk als ZIP-archiefbestanden geleverd. Een praktisch voorbeeld uitvoeren in Flash Professional:

  1. Pak het archiefbestand uit in een map naar keuze.

  2. Selecteer in Flash Professional achtereenvolgens Bestand > Openen.

  3. Blader naar de map waar u het archiefbestand hebt uitgepakt. Selecteer het FLA-bestand in deze map en klik op Openen.

  4. Als u het voorbeeld wilt testen, selecteert u Besturing > Film testen.

ActionScript 3.0-voorbeelden uitvoeren in Flash Builder

Volg een van de volgende procedures (afhankelijk van het type voorbeeld) om een voorbeeld uit te voeren met Flash Builder.

Een codefragmentvoorbeeld uitvoeren in Flash Builder

Een codefragmentvoorbeeld uitvoeren in Flash Builder:

  1. Maak een nieuw Flex-project (selecteer Bestand > Nieuw > Flex-project) of maak een nieuwe MXML-toepassing in een bestaand Flex-project (selecteer Bestand > Nieuw > MXML-toepassing). Geef het project of de toepassing een beschrijvende naam (zoals ContextMenuExample).

  2. Open het gegenereerde MXML-bestand en voeg de tag <mx:Script> toe.

  3. Plak de inhoud van het codefragmentvoorbeeld tussen de tags <mx:Script> en </mx:Script>. Sla het MXML-bestand op.

  4. Als u het voorbeeld wilt uitvoeren, selecteert u Uitvoeren en vervolgens de menu-uitvoeringsoptie voor het primaire MXML-bestand (zoals Uitvoeren > ContextMenuExample uitvoeren).

Een op een klasse gebaseerd voorbeeld uitvoeren in Flash Builder

Een op een klasse gebaseerd voorbeeld uitvoeren in Flash Builder:

  1. Selecteer Bestand > Nieuw > ActionScript-project.

  2. Geef in het veld Projectnaam de naam van de primaire klasse op (bijvoorbeeld ContextMenuExample). Gebruik de standaardwaarden voor de overige velden (of wijzig de waarden overeenkomstig uw specifieke omgeving). Klik op Voltooien om het project en het primaire ActionScript-bestand te maken.

  3. Wis eventuele gegenereerde inhoud uit het ActionScript-bestand. Plak de voorbeeldcode, waaronder pakket- en importinstructies, in het ActionScript-bestand en sla het bestand op.

    Opmerking: Sommige van de op klassen gebaseerde voorbeelden, zoals het flashx.textLayout.container.ContainerController-klassenvoorbeeld, bevatten meerdere niveaus in de pakketdeclaratie (package flashx.textLayout.container.examples {). Sla voor deze voorbeelden het bestand op in een submap die overeenkomt met de pakketdeclaratie (flashx/textLayout/container/examples) of verwijder de pakketnaam (zodat ActionScript alleen begint met package { ). Op deze manier kunt u het bestand vanaf een willekeurige locatie testen.
  4. Als u het voorbeeld wilt uitvoeren, selecteert u Uitvoeren en vervolgens de menu-uitvoeringsoptie voor de primaire ActionScript-klassennaam (zoals Uitvoeren > ContextMenuExample uitvoeren).

Een praktisch voorbeeld uitvoeren in Flash Builder

Praktische voorbeelden worden gewoonlijk als ZIP-archiefbestanden geleverd. Een praktisch voorbeeld uitvoeren in Flash Builder:

  1. Pak het archiefbestand uit in een map naar keuze. Geef de map een beschrijvende naam (bijvoorbeeld ContextMenuExample).

  2. Selecteer in Flash Builder achtereenvolgens Bestand > Nieuw Flex-project. Klik in de sectie Projectlocatie op Bladeren en selecteer de map met de voorbeeldbestanden. Geef in het veld Projectnaam de mapnaam op (bijvoorbeeld ContextMenuExample). Gebruik de standaardwaarden voor de overige velden (of wijzig de waarden overeenkomstig uw specifieke omgeving). Klik op Volgende om door te gaan.

  3. Klik in deelvenster Uitvoer op Volgende om de standaardwaarde te accepteren.

  4. Klik in het deelvenster Bronpaden op de knop Bladeren naast het veld voor het primaire toepassingsbestand. Selecteer het primaire MXML-voorbeeldbestand in de voorbeeldmap. Klik op Voltooien om de projectbestanden te maken.

  5. Als u het voorbeeld wilt uitvoeren, selecteert u Uitvoeren en vervolgens de menu-uitvoeringsoptie voor het primaire MXML-bestand (zoals Uitvoeren > ContextMenuExample uitvoeren).

ActionScript 3.0-voorbeelden uitvoeren op mobiele apparaten

ActionScript 3.0-codevoorbeelden kunnen worden uitgevoerd op mobiele apparaten die ondersteuning bieden voor Flash Player 10.1. Codevoorbeelden worden doorgaans echter uitgevoerd omdat men wil weten hoe bepaalde klassen en methoden werken. Als dit het geval is, voert u het voorbeeld uit op een niet-mobiel apparaat zoals een desktopcomputer. Op een desktopcomputer kunt u gebruik maken van trace-instructies en andere hulpmiddelen voor foutopsporing in Flash Professional of Flash Builder, die u kunnen helpen het codevoorbeeld beter te begrijpen.

Als u het voorbeeld op een mobiel apparaat wilt uitvoeren, kopieert u de bestanden naar het apparaat of naar een webserver. Doe het volgende om bestanden naar het apparaat te kopiëren en het voorbeeld in de browser uit te voeren:

  1. Maak het SWF-bestand door de instructies in ActionScript 3.0-voorbeelden uitvoeren in Flash Professional of in ActionScript 3.0-voorbeelden uitvoeren in Flash Builder op te volgen. In Flash Professional maakt u het SWF-bestand door Controleren > Film testen te selecteren. In Flash Builder maakt u het SWF-bestand door uw Flash Builder-project uit te voeren of samen te stellen of door hierin fouten op te sporen.

  2. Kopieer het SWF-bestand naar een map op het mobiele apparaat. Gebruik de met het apparaat meegeleverde software om het bestand te kopiëren.

  3. In de adresbalk van de browser op het mobiele apparaat typt u file:// en vervolgens de URL van het SWF-bestand. Typ bijvoorbeeld file:://applications/myExample.swf.

Doe het volgende om bestanden naar een webserver te kopiëren en het voorbeeld in de browser van het apparaat uit te voeren:

  1. Maak een SWF-bestand en een HTML-bestand. Volg eerst de instructies in ActionScript 3.0-voorbeelden uitvoeren in Flash Professional of in ActionScript 3.0-voorbeelden uitvoeren in Flash Builder op. In Flash Professional wordt door het selecteren van Controleren > Film testen alleen het SWF-bestand gemaakt. Om beide bestanden te maken, selecteert u in het dialoogvenster Publicatie-instellingen op het tabblad Indelingen zowel Flash als HTML. Selecteer vervolgens Bestand > Publiceren om zowel het HTML-bestand als het SWF-bestand te maken. In Flash Builder maakt u zowel het SWF-bestand als het HTML-bestand door uw Flash Builder-project uit te voeren of samen te stellen of door hierin fouten op te sporen.

  2. Kopieer het SWF-bestand het HTML-bestand naar een map op de webserver.

  3. In de adresbalk van de browser op het mobiele apparaat typt u het HTTP-adres van het HTML-bestand. Typ bijvoorbeeld http://www.myWebServer/examples/myExample.html.

Denk na over de volgende kwesties, voordat u een voorbeeld op een mobiel apparaat uitvoert.

Grootte van het werkgebied

Als u een voorbeeld uitvoert op een mobiel apparaat is het werkgebied veel kleiner dan bij een niet-mobiel apparaat. Bij veel voorbeelden hoeft het werkgebied niet een bepaalde grootte te hebben. Geef bij het maken van het SWF-bestand een werkgebiedgrootte op die geschikt is voor uw apparaat. Geef bijvoorbeeld 176 x 208 pixels op.

Het doel van de praktische voorbeelden in de ActionScript 3.0-ontwikkelaarsgids is de verschillende ActionScript 3.0-concepten en -klassen te illustreren. De gebruikersinterfaces hiervan zijn dusdanig ontworpen dat ze er mooi uit zien en goed werken op een desktop- of een laptopcomputer. Hoewel de voorbeelden werken op mobiele apparaten, zijn het werkgebied en het ontwerp van de interface niet geschikt voor een klein scherm. Adobe raadt u aan de praktische voorbeelden op een computer uit te voeren om zo meer te leren over ActionScript. Vervolgens kunt u de relevante codefragmenten in uw mobiele toepassingen uitvoeren.

Tekstvelden in plaats van trace-instructies

Wanneer u een voorbeeld uitvoert op een mobiel apparaat, kunt u de uitvoer van de trace-instructies van het voorbeeld niet zien. Als u de uitvoer wilt zien, maakt u een instantie van de klasse TextField. Voeg vervolgens de tekst van de trace-instructies toe aan de eigenschap text van het tekstveld.

U kunt de volgende functie gebruiken om een tekstveld voor tracering in te stellen:

function createTracingTextField(x:Number, y:Number, 
                                width:Number, height:Number):TextField { 
           
    var tracingTF:TextField = new TextField(); 
    tracingTF.x = x; 
    tracingTF.y = y; 
    tracingTF.width = width; 
    tracingTF.height = height; 
     
    // A border lets you more easily see the area the text field covers. 
    tracingTF.border = true; 
    // Left justifying means that the right side of the text field is automatically 
    // resized if a line of text is wider than the width of the text field. 
    // The bottom is also automatically resized if the number of lines of text 
    // exceed the length of the text field. 
    tracingTF.autoSize = TextFieldAutoSize.LEFT; 
     
    // Use a text size that works well on the device. 
    var myFormat:TextFormat = new TextFormat(); 
    myFormat.size = 18; 
    tracingTF.defaultTextFormat = myFormat; 
     
    addChild(tracingTF); 
    return tracingTF; 
}

Voeg deze functie bijvoorbeeld toe aan de documentklasse als een functie van het type private. Traceer vervolgens in andere methoden van de documentklasse gegevens met soortgelijke code zoals hier staat weergegeven:

var traceField:TextField = createTracingTextField(10, 10, 150, 150); 
// Use the newline character "\n" to force the text to the next line. 
traceField.appendText("data to trace\n"); 
traceField.appendText("more data to trace\n"); 
// Use the following line to clear the text field. 
traceField.appendText("");

De methode appendText() accepteert slechts één waarde als parameter. Deze waarde moet een tekenreeks zijn (een String-instantie of een letterlijke tekenreeks). Wanneer u de waarde wilt afdrukken van een variabele die geen tekenreeks is, moet u de waarde eerst omzetten in een tekenreeks. De eenvoudigste manier om dit te bereiken is het aanroepen van de methode toString() van het object:

var albumYear:int = 1999; 
traceField.appendText("albumYear = "); 
traceField.appendText(albumYear.toString());

Tekengrootte

In veel voorbeelden worden tekstvelden gebruikt om te helpen bij het illustreren van een concept. In sommige gevallen wordt de leesbaarheid op een mobiel apparaat verbeterd als de tekengrootte in het tekstveld wordt aangepast. Als in een voorbeeld een tekstveldinstantie genaamd myTextField wordt gebruikt, kan de tekengrootte hiervan aan de hand van de volgende code worden aangepast:

// Use a text size that works well on the device. 
var myFormat:TextFormat = new TextFormat(); 
myFormat.size = 18; 
myTextField.defaultTextFormat = myFormat

Gebruikersinvoer vastleggen

Het mobiele besturingssysteem en de mobiele browser leggen een aantal gebeurtenissen aangaande gebruikersinvoer vast, die niet worden ontvangen door de SWF-inhoud. Specifiek gedrag is afhankelijk van het besturingssysteem en de browser, maar kan resulteren in onverwacht gedrag wanneer u de voorbeelden op een mobiel apparaat uitvoert. Zie Hogere prioriteit KeyboardEvent voor meer informatie.

Ook zijn de gebruikersinterfaces van veel voorbeelden ontworpen voor een desktop- of een laptopcomputer. Zo zijn de meeste praktische voorbeelden in de ActionScript 3.0-ontwikkelaarsgids bij uitstek geschikt voor weergave op een desktopcomputer. Daarom wordt niet altijd het hele werkgebied weergegeven op het scherm van het mobiele apparaat. De mogelijkheid om door de inhoud van de browser te pannen is afhankelijk van de browser. Bovendien zijn de voorbeelden niet ontworpen voor het afvangen en afhandelen van schuif- of bladergebeurtenissen. Daarom zijn de gebruikersinterfaces van sommige voorbeelden niet geschikt om op een klein scherm te worden uitgevoerd. Adobe raadt u aan de voorbeelden op een computer uit te voeren om zo meer te leren over ActionScript. Vervolgens kunt u de relevante codefragmenten in uw mobiele toepassingen uitvoeren.

Zie Weergaveobjecten pannen en schuiven voor meer informatie.

Afhandeling van focus

Bij sommige voorbeelden moet u zorgen dat een veld de focus krijgt. Als een veld de focus heeft, kunt u bijvoorbeeld tekst invoeren of een knop selecteren. Gebruik het aanwijsapparaat van het mobiele apparaat, bijvoorbeeld de stylus, of uw vinger om een veld de focus te geven. U kunt hiervoor ook de navigatietoetsen van het mobiele apparaat gebruiken. Gebruik de selectietoets van het mobiele apparaat, net zoals u Enter op een computer gebruikt, voor het selecteren van een knop die de focus heeft. Op sommige apparaten kunt u een knop selecteren door er tweemaal op te tikken.

Zie Focus beheren voor meer informatie.

Afhandeling van muisgebeurtenissen

Veel voorbeelden luisteren of er muisgebeurtenissen plaatsvinden. Op een computer doen muisgebeurtenissen zich bijvoorbeeld voor als een gebruiker met de muisaanwijzer over een weergaveobject gaat of met de muisknop op een weergaveobject klikt. Op mobiele apparaten worden gebeurtenissen die het resultaat zijn van het gebruik van een aanwijsapparaat, zoals een stylus, of het gebruik van een vinger, aanraakgebeurtenissen genoemd. In Flash Player 10.1 worden aanraakgebeurtenissen aan muisgebeurtenissen toegewezen. Deze toewijzing zorgt ervoor dat SWF-inhoud die is ontwikkeld voor een oudere versie van Flash Player 10.1, blijft werken. Voorbeelden werken derhalve wanneer een aanwijsapparaat wordt gebruikt bij het selecteren of slepen van een weergaveobject.

Prestaties

Mobiele apparaten zijn minder krachtig dan desktopapparaten. Sommige voorbeelden die de CPU zwaar belasten, werken mogelijk langzaam op een mobiel apparaat. Zo maakt het voorbeeld in Voorbeeld van de API voor tekenen: Algorithmic Visual Generator bij het invoeren van elk frame uitgebreide berekeningen en tekenbewerkingen. Als u dit voorbeeld op een computer uitvoert, worden er verschillende API's voor tekenen gedemonstreerd. Dit voorbeeld is echter niet geschikt voor sommige mobiele apparaten vanwege de prestatiebeperkingen van deze apparaten.

Op De prestaties voor het Flash-platform optimaliseren vindt u meer informatie over de prestaties op mobiele apparatuur.

Tips en trucs

Bij de voorbeelden is geen rekening gehouden met de speciale die het ontwikkelen van toepassingen voor mobiele apparaten met zich meebrengt. Deze speciale vereisten zijn het gevolg van de beperkingen van het geheugen en het vermogen van de CPU van mobiele apparaten. Daar komt nog bij dat een gebruikersinterface voor een klein scherm aan andere eisen moet voldoen dan een gebruikersinterface voor een desktopcomputer. Op http://www.adobe.com/go/learn_optimizing_fp_nl vindt u meer informatie over het ontwikkelen van toepassingen voor mobiele apparatuur.