Greg, There are many issues with what you are doing, but this will get you started.
UIComponent does not have any logic to determine its own size and provide this feedback to the container. Try calling setActualSize on each of your uicomponents after you create them to size them to your desired size. Also, even if everything else was okay, the measurement process for components happens after the are added as children, and you are checking their size first. Finally, you should never create children in the constructor of a component. You are trying to create your own children before your original component is ever added to the display list. I would advise doing more than skimming that guide because all of the issues with this code are covered in that doc. Mike --- In [email protected], "greg h" <[EMAIL PROTECTED]> wrote: > > I have created a small custom component that internally uses the drawing API > on multiple instances of UIComponent (internally using drawRect()). > > However, at runtime the component's width and height properties both return > zero (0), and when placed inside a container the component does not lay out > properly. > > I have skimmed, without luck, the docs for "Creating and Extending Flex 3 > Components <http://livedocs.adobe.com/flex/3/html/Part4_CreateComps_1.html>" > among other sources. > > One thing that really strikes me is that my code is very similar to that > used in the example in the Language Reference docs for > flash.display.Graphics: > http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/displ ay/Graphics.html#includeExamplesSummary > > In the Graphics example when I trace width it returns a value, but in my > code below when I trace square.width it returns zero? > > Any helpful guidance would be appreciated :-) > > Thanks, > > g > > package > { > import mx.containers.Canvas; > import mx.core.UIComponent; > > public class MyComp extends Canvas > { > public var squareSize:uint = 10; > public var squaresTotal:uint = 13; > public var color:uint = 0xf8b34e; > > private var currentAlpha:Number = 1.0; > private var square:UIComponent = new UIComponent(); > > public function MyComp() > { > super(); > > square.graphics.beginFill(color, 1); > square.graphics.drawRect(0, 0, squareSize, squareSize); > square.graphics.endFill(); > square.alpha = currentAlpha; > this.addChild(square); > for (var i:Number=1; i<(squaresTotal-1); i++) > { > square = new UIComponent(); > currentAlpha = 1.0 - (i * 1/squaresTotal) ; > square.graphics.beginFill(color, 1); > square.graphics.drawRect( (squareSize*1.25*i), 0, > squareSize, squareSize); > square.graphics.endFill(); > square.alpha = currentAlpha; > trace("**MyComp square width: "+ square.width); // RETURNS 0 > this.addChild(square); > } > this.invalidateSize(); //should I override? > this.invalidateProperties(); //should I override? > this.invalidateDisplayList(); //should I override? > this.measure(); //should I override? > this.updateDisplayList(unscaledWidth, unscaledHeight); //should > I override? > trace(">>MyComp height: "+ this.height); // RETURNS 0 > trace(">>MyComp width: "+ this.width); // RETURNS 0 > trace(">>MyComp measuredWidth: "+ this.measuredWidth); // > RETURNS 0 > trace(">>MyComp unscaledWidth: "+ this.unscaledWidth); // > RETURNS 0 > trace(">>MyComp square width: "+ square.width); // RETURNS 0 > > } > > > } > } >
