Flex 3 - Get the actual size of a component

I'd like to get the actual height of a component after adding some children.

When inspecting the variables tab in debug mode, I see 2 different height variables: $height (which contains the correct value: 138) and height/_height (which contains a wrong value: 10).

I guess that the display is not updated and so I'm not getting the correct height using component.height, but how can I get the value in $height?

Thanks for any help you can provide =)

Regards, BS_C3

@Flextras

Again, thanks a lot for your answer! That was really detailed =)

Measuredheight is not giving me the value I'm looking for, and explicitHeight has no value (NaN). I cannot test right now, so I can't tell for unscaledHeight...

Here's the structure of what I have:

MainContainer - Canvas
    BOX1 - Canvas (height = 100)
    BOX2 - Canvas (height = 100)
    VariableBox - Canvas (height: depends on the height of it's variable number of children)
    Text - TextArea

I need the VariableBox's height in order to position Text.

The function looks like this:

updateDisplay(){
    for(i;i<list.length;i++){
        VariableBox.addChild(new HBox);
    }
    // reposition Text depending on VariableBox's height
}

I know I'm not giving any code but I'm not on my working computer right now >_<

Hope this helps!!

Short answer: Use the getMeasuredOrExplicitWidth() and getMeasuredOrExplicitHeight() methods.

In many cases, height or width will return the same values as those methods.

Longer answer: What component are you using? Since you tagged this with Flex, I'm going to assume it is a Flex visual Component that extends UIComponent.

You have a handful of different height values to look at, but keep in mind it is always the responsibility of the parent to size it's children. Adding children to a component will not necessarily change it's height or width. It depends if the component you're adding children to takes children into account, or not.

First take a look at measuredHeight and measuredWidth. These are the preferred size values of the component, calculated using the measure method. Some components, such as an HBox or VBox will automatically be "aware" of their children and will use these when calculating it's size. Other components, such as UIComponent do not take into account children when setting the measuredHeight or measuredWidth.

Second, you can take a look at explicitHeight and explicitWidth. If you set height or width, then these values are set. I do not believe these values are set if you use the setActualSize() method. There is some magic under the hood so that explicitHeight and explicitWidth are masked behind height and width. They are often the same, but not always.

I don't usually deal with scaling, but if you need the unscaled height and width of a component, there is an unscaledWidth and unscaledHeight protected properties of the component. I believe those are the values passed to the updateDisplayList() method.

Keep in mind that for a component to resize itself after adding or removing children, the component must go through a lifecycle of it's own. So this code:

trace(container.width);
container.addChild(myChild);
trace(container.width);

Probably will not change the width of the container, because the container has not had a chance to run the measure(), updateDisplayList(), or commitProperties() methods.

If this doesn't help, you're going to have to get more specific and provide some code.

Final solution:

I finally found some workaround that's satisfying for me without doing some extravagant stuff...

I had a parent container to which I was dynamically adding some children, and it's height wasn't getting updated. The issue I was having is that neither measuredHeight, nor explicitHeight, nor height, nor unscaledHeight of the parent container were giving me the height I needed when I wanted it.

So, I added a listener to the creationComplete of each child. Once the creation complete event is launched, every control of the child is taken into account. At this moment, the measuredHeight of the parent container is set to the expected value. So I just needed to set:

parentContainer.height = parentContainer.measuredHeight

Thanks again to Flextras who has given some useful information =)

Regards.