ActionScript 3
Trabajar con objetos de visualización

Sintaxis

1. addChild(child) : agrega un nuevo elemento al árbol secundario de este objeto como el elemento superior.
2. addChildAt(child, index) : agrega un nuevo elemento al árbol hijo de este objeto en una posición específica. El ítem de abajo tiene un índice de 0.
3. getChildAt(index) : devuelve un hijo con un índice determinado.
4. getChildIndex(child) devuelve el índice de un hijo directo de este objeto. De lo contrario se lanza una excepción.
5. removeChild(child) : elimina el hijo directo especificado del árbol hijo de este objeto. Lanza una excepción si el padre del niño suministrado no es igual a this .
6. removeChildAt(index) : elimina un elemento secundario seleccionado por índice en lugar de por referencia. Se lanza la excepción si el árbol hijo no es tan ancho.
7. removeChildren(beginIndex:int = 0, endIndex:int = 0x7fffffff)) : se agrega en Flash Player 11, elimina un subconjunto de hijos por rango de índice o todos los hijos si se llama sin parámetros.
8. setChildIndex(child,index) : cambia el índice del niño al nuevo valor, cambiando a todos los niños para ocupar el lugar liberado.
9. swapChildren(child1,child2) : intercambia las posiciones de los dos niños en la lista de visualización, sin afectar las posiciones de otros niños.
10. swapChildrenAt(index1,index2) : intercambia a los niños ubicados por sus índices.

Observaciones

Introducción a la lista de visualización

En AS3, los activos de visualización no están visibles hasta que se agregan a la Lista de visualización.

El tiempo de ejecución de AIR / Flash tiene una estructura de visualización jerárquica (relación padre-hijo donde los hijos pueden tener sus propios hijos), siendo el stage el padre de nivel superior.

Para agregar algo a la lista de visualización, use addChild o addChildAt . Este es un ejemplo básico de cómo dibujar un círculo y agregarlo a la lista de visualización:

var myCircle:Shape = new Shape();
        
myCircle.graphics.beginFill(0xFF0000); //red
myCircle.graphics.drawCircle(25, 25, 50);
myCircle.graphics.endFill();
        
this.addChild(myCircle); //add the circle as a child of `this`

Para ver el objeto en el ejemplo anterior, this (el contexto del código) también debe estar en la lista de visualización, así como cualquier padre que tenga. En AS3, el stage es el padre más superior.

Los objetos de visualización solo pueden tener un padre. Entonces, si un hijo ya tiene un padre y lo agrega a otro objeto, se eliminará de su padre anterior.

Orden Z / Capas

Digamos que usted replicó el código del ejemplo anterior, por lo que tuvo 3 círculos:

var redCircle:Shape = new Shape();
redCircle.graphics.beginFill(0xFF0000); //red
redCircle.graphics.drawCircle(50, 50, 50); //graphics.endFill is not required

var greenCircle:Shape = new Shape();
greenCircle.graphics.beginFill(0x00FF00); //green
greenCircle.graphics.drawCircle(75, 75, 50);
        
var blueCircle:Shape = new Shape();
blueCircle.graphics.beginFill(0x0000FF); //blue
blueCircle.graphics.drawCircle(100, 100, 50);

this.addChild(redCircle); 
this.addChild(greenCircle); 
this.addChild(blueCircle); 

Dado que el método addChild agrega el elemento secundario encima de todo lo demás en el mismo padre, obtendrá este resultado con los elementos en capas en el mismo orden en que usa addChild:

Si querías un hijo en capas diferente en relación a sus hermanos, puedes usar addChildAt . Con addChildAt , pasa otro parámetro que indica el índice (orden z) en el que debe estar el hijo. Siendo 0 la posición / capa más baja.

this.addChild(redCircle); 
this.addChild(greenCircle); 
this.addChildAt(blueCircle,0); //This will add the blue circle at the bottom

Ahora el círculo azul está debajo de sus hermanos. Si más adelante desea cambiar el índice de un niño, puede usar el método setChildIndex (en el padre del niño).

this.setChildIndex(redCircle, this.numChildren - 1); //since z-index is 0 based, the top most position is amount of children less 1.

Esto reorganizará el círculo rojo para que esté por encima de todo lo demás. El código anterior produce exactamente el mismo resultado que this.addChild(redCircle) .

Eliminar objetos de visualización

Para eliminar objetos, tiene los removeChild converse removeChild y removeChildAt , así como el método removeChildren .

removeChild(redCircle); //this will take redCircle off the display list

removeChildAt(0); //this will take the bottom most object off the display list 

removeChildren(); //this will clear all children from the display list

removeChildren(1); //this would remove all children except the bottom most

removeChildren(1,3); //this would remove the children at indexes 1, 2 & 3

Eventos

Cuando se agrega un niño a la lista de visualización, algunos eventos se activan en ese niño.

• Event.ADDED
• Event.ADDED_TO_STAGE

Por el contrario, también están los eventos eliminar:

• Event.REMOVED
• Event.REMOVED_FROM_STAGE

Adobe Animate / Flash Professional

Cuando se trata de líneas de tiempo de FlashProfessional / Adobe Animate, agregar algo a la línea de tiempo maneja los matices de la lista de visualización automáticamente. Se agregaron y eliminaron de la lista de visualización automáticamente por la línea de tiempo.

Sin embargo, es bueno tener en cuenta que:

Si manipula mediante el código la filiación de un objeto de visualización creado por la línea de tiempo (utilizando addChild / setChildIndex), ese hijo ya no será eliminado automáticamente por la línea de tiempo y deberá eliminarse mediante el código.

Capas

Puede haber situaciones en las que decida que un conjunto de objetos de visualización siempre debe estar por encima de otro conjunto de objetos, por ejemplo, flechas sobre cabezas, explosiones sobre algo que acaba de explotar, etc. Para realizar esto de la forma más simple posible, debe designar y cree un conjunto de Sprite s, organícelos en orden de abajo hacia arriba, luego agregue todos los objetos del conjunto "anterior" a una capa superior a la utilizada para los objetos del conjunto "inferior".

var monsters:Vector.<Monster>;
var bullets:Vector.<Bullet>; // desired: bullets strictly above monsters
var monsterLayer:Sprite=new Sprite();
var bulletLayer:Sprite=new Sprite();
addChild(monsterLayer);
addChild(bulletLayer);

Luego, cada vez que agregue un Monster a la lista de visualización, agréguelo a monsterLayer , y cada vez que agregue una Bullet , agregue a bulletLayer para lograr el efecto deseado.

Eliminar todos los objetos de la lista de visualización

Si se dirige a Flash Player 11+, el método incorporado removeChildren es la mejor manera de eliminar todos los hijos:

removeChildren(); //a start and end index can be passed 

Para aplicaciones heredadas, lo mismo se puede lograr con un bucle:

while (numChildren > 0) {
    removeChildAt(0);
}

Transición de cuadros a cambio manual de contenido

Al principio, un desarrollador de Flash utiliza marcos, ya que están disponibles de forma nativa en Flash Player, para alojar varias pantallas de su aplicación (la mayoría de las veces es un juego). Eventualmente, pueden tropezar con el problema de que algo sale mal exactamente porque han usado marcos, y han pasado por alto las dificultades que surgen de esto, y buscar formas de conservar la estructura de su marco pero también eliminar el obstáculo de usar marcos con sus complicaciones. La solución es usar clases descendientes de Sprite , o marcos exportados como MovieClip s con un solo marco (para los que se diseñan en Adobe Flash CS), y cambiar manualmente los contenidos con addChild() y removeChild() .

La clase del administrador debe tener todas sus clases de marco hijo listas, y siempre que se llame una transición, se puede usar una función similar a esta:

var frames:Vector.<DisplayObject>; // this holds instances to ALL children
var currentFrame_alt:int; // current frame. Can't use the property
function changeFrame(frame:int):void {
    removeChild(frames[currentFrame_alt]);
    addChild(frames[frame]);
    currentFrame_alt=frame;
}

Todos los elementos Event.ADDED_TO_STAGE pueden enviar y escuchar eventos con Event.ADDED_TO_STAGE utilizado como punto de entrada para lo que ocurra después de que gotoAndStop() ese marco, y cualquier transición saliente se puede codificar como eventos basados ​​en cadenas, que se escuchan en Main clase Main . que luego realiza la transición.

frames[0].addEventListener("startGame",startGame); // assuming frame 0 is a "Play" button
function startGame(e:Event):void {
    changeFrame(1); // switch to frame 1 - will display frames[1]
}

Por supuesto, el conjunto de cadenas debe estar predefinido, por ejemplo, la pantalla de introducción puede tener dos botones para iniciar el juego, "Iniciar juego" y "Iniciar silenciado", por ejemplo, y los botones deben enviar diferentes eventos, que luego se manejarán. diferente en la clase de gerente.

Este patrón puede ir tan profundo como sea necesario. Si algún fotograma del proyecto contiene un MovieClip con múltiples fotogramas, también se puede desacoplar en sprites con este método.