AS3: Child added, but not displaying

Question

public class ItemView extends MovieClip {

  private var _title:TextField;
  private var _extra:MovieClip;

  public function ItemView( ) {
    setup();
    return;
  }

  private function setup( ):void {
    trace("ItemView::setup()");
    _title = new TextField();
    _title.text = "Title";
    addChild(_title);
    _extra = new MovieClip();
    _extra.width = 200;
    _extra.height = 40;
    _extra.graphics.beginFill(0x0000ff);
    _extra.graphics.drawRect(0, 0, 20, 20);
    _extra.graphics.endFill();
    addChild(_extra);
    return;
  }

}

When I create an instance of ItemView and add it to the stage, "Title" displays but the blue square does not. However, if I make the graphics calls on this instead of _extra, I do see the blue square. This tells me that _extra itself is not displaying properly, but I can't figure out why.

What am I missing? Is there some special procedure for adding one MovieClip to another?

Answer 1

A little quirk.

When you set the width/height of the MovieClip object, Flash internally also adjusts the scaleX and scaleY properties. For instance, if the original width was 100, and now you've set it to 200, then the new scaleX should be 2. This means Flash will display it at 2X scale horizontally.

Now, initially the width is 0 (blank object), so when you set a new width, the new scaleX should become infinite - or 0, as Flash does it.

So even though you've drawn something onto the object, it's still at zero scale, which is why nothing gets displayed. The way to remedy this, as suggested by another poster, is to avoid setting width/height on the blank object or alternatively to reset scaleX and scaleY to 1 after your drawing is done.

...
_extra.graphics.endFill();
_extra.scaleX = _extra.scaleY = 1;