Werken met het weergaveoverzicht

U kunt een object aan een DisplayObjectContainer-object toevoegen door de methode addChild() of addChildAt() van de container aan te roepen. In het geval van het werkgebied kunt u tijdens de ontwerpfase ook een object aan het weergaveoverzicht toevoegen door er een te maken. Componenten kunt u vanuit het deelvenster Componenten naar het werkgebied slepen. Als u een object aan een container wilt toevoegen met ActionScript, maakt u eerst een instantie van het object door de constructor aan te roepen met de operator new . Vervolgens roept u de methode addChild() of addChildAt() aan om de instantie op te nemen in het werkgebied en het weergaveoverzicht. Met de methode addChild() wordt het object ingevoegd op de volgende positie in het weergaveoverzicht en met addChildAt() geeft u op op welke positie het object moet worden ingevoegd. Als u een positie opgeeft die al wordt ingenomen, worden het object op die positie en alle objecten daarboven een positie naar boven verplaatst. De eigenschap numChildren van een DisplayObjectContainer-object bevat informatie over het aantal weergaveobjecten in het object. U kunt een object uit het weergaveoverzicht ophalen door de methode getChildAt() aan te roepen en de positie op te geven. Wanneer u op de hoogte bent van de naam van het object, kunt u de methode getChildByName() aanroepen.

In het volgende voorbeeld worden de namen en posities van drie componenten in het weergaveoverzicht weergegeven. Sleep eerst een NumericStepper-, Button- en ComboBox-instantie naar het werkgebied zodat ze elkaar overlappen en geef hieraan de instantienamen aNs , aButton en aCb . Voeg vervolgens in het deelvenster Handelingen de volgende code toe aan frame 1 van de tijdlijn:

var i:int = 0; 
while(i < numChildren) { 
    trace(getChildAt(i).name + " is at position: " + i++); 
}

De volgende regels worden weergegeven in het deelvenster Uitvoer:

aNs is at position: 0 
aButton is at position: 1 
aCb is at position: 2

U kunt de positie en weergavediepte van een object in het weergaveoverzicht wijzigen door de methode addChildAt() aan te roepen en de naam en de gewenste positie van een object op te geven als de parameters van de methode. U kunt bijvoorbeeld de volgende code toevoegen aan het voorgaande voorbeeld om de NumericStepper op de voorgrond weer te geven en de lus te herhalen om de nieuwe posities van de componenten in het weergaveoverzicht weer te geven:

this.addChildAt(aNs, numChildren - 1); 
i = 0; 
while(i < numChildren) { 
    trace(getChildAt(i).name + " is at position: " + i++); 
}

In het deelvenster Uitvoer wordt het volgende weergegeven:

aNs is at position: 0 
aButton is at position: 1 
aCb is at position: 2 
aButton is at position: 0 
aCb is at position: 1 
aNs is at position: 2

De NumericStepper moet ook vóór de andere componenten worden weergegeven op het scherm.

numChildren verwijst naar het aantal objecten (van 1 tot n ) in het weergaveoverzicht waarbij aan de eerste positie in het weergaveoverzicht het getal 0 wordt toegewezen. Wanneer het overzicht drie objecten bevat, is de indexpositie van het derde object dus 2. Dit betekent dat u naar de laatste positie of het bovenste object in het weergaveoverzicht kunt verwijzen op basis van de weergavediepte, bijvoorbeeld numChildren - 1 .

U kunt een component uit een weergaveobjectcontainer en het bijbehorende weergaveoverzicht verwijderen met de methoden removeChild() en removeChildAt() . In het volgende voorbeeld worden drie componenten Button op elkaar geplaatst in het werkgebied en wordt voor elke component een gebeurtenislistener toegevoegd. Wanneer u op een component Button klikt, wordt deze uit het weergaveoverzicht en het werkgebied verwijderd.

1. Maak een nieuw document van het type Flash-bestand (ActionScript 3.0).

2. Sleep een Button van het deelvenster Componenten naar het deelvenster Bibliotheek.

3. Open het deelvenster Handelingen, selecteer frame 1 van de hoofdtijdlijn en voeg de volgende code toe:

   import fl.controls.Button; 
    
   var i:int = 0; 
   while(i++ < 3) { 
       makeButton(i); 
   } 
   function removeButton(event:MouseEvent):void { 
       removeChildAt(numChildren -1); 
   } 
   function makeButton(num) { 
       var aButton:Button = new Button(); 
       aButton.name = "Button" + num; 
       aButton.label = aButton.name; 
       aButton.move(200, 200); 
       addChild(aButton); 
       aButton.addEventListener(MouseEvent.CLICK, removeButton); 
   }

   Zie 'Weergave programmeren' in ActionScript 3.0 programmeren voor een volledige uitleg over het weergaveoverzicht.