Flex: Bottom-left align components?

Question

As the title suggests, is there any way to bottom-left align components?

An <HBox .../> nested in a <Canvas .../> doesn't work because the elements in the HBox are top-aligned instead of bottom aligned.

For example, I'd like my components to be aligned like this:

+-------------+ <-- container
| components  |
|  |    V     |
|  V  +--+    |
| +-+ |  |    |
| +-+ +--+    |
+-------------+

Answer 1

Extend the HBox and/or Box to change the positioning. I suspect you'll probably have to override the updateDisplayList method to change the way components are positioned. Probably instead of setting the y value as "0" you'll want to set it to unscaledHeight-component.width.

Answer 2

You just need to set the verticalAlign and horizontalAlign styles on the hbox ie:

<mx:Canvas>
<mx:HBox verticalAlign="bottom" horizontalAlign="left" left="0" bottom="0"> </mx:HBox>
</mx:Canvas>