Thursday, January 24, 2008

How to use a percentage for maxWidth or maxHeight?

Recently I wanted to set the maxHeight of a component to a percentage. Sadly enough this isn't supported in Flex. There's however a very simple workaround that seems to work all the time: set the maxHeight or maxWidth in the resize event of its container:

<mx:Canvas
  id="cnvsComponent"
  resize="childComponent.maxHeight = cnvsComponent.height"
  width="100%" height="100%">
    <mx:Tree id="childComponent" />
</mx:Canvas>

2 comments:

Frankie Loscavio said...

I wonder if you could also use in the script tags:

containerID.percentHeight = 100;

containerID.maxHeight = containerID.percentHeight;

Since you can say percentHeight in script it might be worth trying. Then you can subtract the percentage value if you don't want the full 100% of the container for max or min or whatever. Keep up the good work mang.

neilson9 said...

I see how this works, but I a very similar problem with a quirk. I have 2 chart legends which I want to layout (using FlowLayout) - but to allow them (the legends) to use their measured sizes. The FlowContainer (parent) to use a percentSize of the panel and for its sizing to not be dictated by the children (I want the scrollbars to appear for the user to use them). Its a bit of a catch 22 - so Im stuck ;)
Regards.