AS3 Adding same DisplayObject does not render TextField the second time

Question

The problem I'm having is that I'm expecting multiple TextFields to appear, and I'm only seeing one appear. I've narrowed it down to this code. When I add the List element, I see an empty rectangle, with a rectangle of the exact size underneath as I would expect. The problem I see is that the TextField only appears in the second rectangle. If I add three elements, only the last is visualized.

The following code takes a list of DisplayObjects (currently two TextFields), iterates through the list, and creates a container Sprite for each. The container Sprite for each is offset by the height of each DisplayObject height, effectively creating a visual list. If the same TextField is used twice or more in the list, the TextField is only drawn in the last element. Each container Sprite contains a bounding box to indicate that it is present.

package
{
import flash.display.DisplayObject;
import flash.display.Sprite;
import flash.geom.Rectangle;
import flash.text.AntiAliasType;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;

public class List extends Sprite
{
    private var data:Array=new Array;
    private var label:TextField= new TextField();

    public function List()
    {
        super();

        label.selectable=true;
        label.autoSize              = TextFieldAutoSize.LEFT;
        label.antiAliasType         = AntiAliasType.ADVANCED;
        label.text                  = "Testing";
        data.push(label);
        data.push(label);

    }


    public function renderList():void{
        var height:int=0;
        for (var i:int=0; i< data.length; i++){
            //get current sprite in list
            var current:DisplayObject=data[i];

            //create new sprite to contain element of array
            var listItem:Sprite=new Sprite;
            listItem.addChild(current);

            //draw bounding rectangle for reference
            var rect:Rectangle=current.getBounds(this);
            listItem.graphics.lineStyle(1, 0x000000);
            listItem.graphics.beginFill(0xFFFFFF);
            listItem.graphics.drawRect(rect.x, rect.y, rect.width, rect.height);
            listItem.graphics.endFill();

            //set height corresponding to bounds height
            listItem.y=height;

                            //calculate height for next item
            height=height + rect.height;

                            //add new list item 
            addChild(listItem);
        }
    }


}
}

Asad Asad · Accepted Answer · 2013-04-08T04:58:35

You cannot add the same TextField object as a child of two or more containers. you need to add new TextField() again somewhere in your code.

Like if you modify your constructor as below you will be able to see two TextFields

public function List()
    {
        super();

        label.selectable=true;
        label.autoSize              = TextFieldAutoSize.LEFT;
        label.antiAliasType         = AntiAliasType.ADVANCED;
        label.text                  = "Testing 1";
        data.push(label);
        label = new TextField();
        label.selectable=true;
        label.autoSize              = TextFieldAutoSize.LEFT;
        label.antiAliasType         = AntiAliasType.ADVANCED;
        label.text                  = "Testing 2";
        data.push(label);
    }

AS3 Adding same DisplayObject does not render TextField the second time

2 Answers