Flex Dynamically Created Components Added to Custom Components

Question

I am created a dynamically adding a VBox, that contains two images. Into a Custom Component that is derived from UIComponent. The problem is the Vbox that contains the two image is only a really tiny size. I would like the VBox stretch to the size of the two images.

This is how I am creating the Vbox....

var open:Image = new Image();
open.source = 'assets/icons/open.png';

var save:Image = new Image();
save.source = 'assets/icons/save.png';

var box:VBox = new VBox();
box.addChild(open);
box.addChild(save);

The component is like this....

public class MyComponent extends UIComponent

I assign the VBox to the component like this(this is after the creationComplete event)

public function set VBoxOptions(value:UIComponent) : void {
            if(_vBoxOptions){
                removeChild(_vBoxOptions);
            }
            _vBoxOptions = value;
            addChild(_vBoxOptions);
            invalidateSize();
        }

In the update display list I do this..

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
   if(_hoverOptions)
  {
      _hoverOptions.move(unscaledWidth+2,2); //please note this is not the problem,
   }
}

Thanks for help in Advance...

Answer 1

Do you need to extend UIComponent, because Canvas is going to get you there a lot quicker:

package
{
    import flash.events.Event;

    import mx.containers.Canvas;
    import mx.core.UIComponent;

    public class MyUIComponent extends Canvas
    {
        private var _vBoxOptions:UIComponent;

        public function MyUIComponent()
        {
            super();
        }

        public function set vBoxOptions(value:UIComponent):void
        {
            if(_vBoxOptions && this.contains(_vBoxOptions))
            {
                this.removeChild(_vBoxOptions);
            }

            _vBoxOptions = value;
            _vBoxOptions.validateNow();

            this.addChild(_vBoxOptions);
        }
    }
}