CODEWITHSUNDEEP
actionscript-3flashapache-flex
1.21 gigawatts
1.21 gigawatts

Reputation: 17770

How to adjust the position of an image in an HGroup aligned vertically by baseline

I have a HGroup with a few Labels and an Image. The HGroup has verticalAlign set to baseline. All the Labels line up correctly. The Image does not. The Image is much too low.

Is there a property or style to adjust the vertical position of the Image? It looks like the HGroup uses baseline or baselinePosition to position the Labels. It looks like Image has that property and style as well but it doesn't seem to do anything when I change it.

Example code: 

<s:HGroup verticalAlign="baseline"
          top="10"
          right="10"
          left="10">
    <s:Button label="Previous"/>

    <s:Label text="Total results:" />

    <s:Image height="28" width="100"
             source="myImage.png"
             />

    <s:Spacer width="100%"/>

    <s:Button label="Next" />
</s:HGroup>

HorizontalLayout has a method called calculateBaselineTopBottom() and it's called in updateDisplayListReal(). It seems it is doing something with baseline and baselinePosition. It also seems to use alignmentBaseline. So far in my tests it doesn't seem to change anything.

Upvotes: 0

Views: 55

Answers (1)

1.21 gigawatts
1.21 gigawatts

Reputation: 17770

It looks like setting the baseline property does it. It wasn't working because in my tests I was passing a String value (well, it was converted to a String along the way). So it needs to be passed as a Number. The baseline property accepts Objects which is why it would accept String or Number.

It also accepts negative values. So the following works: 

<s:HGroup verticalAlign="baseline"
          top="10"
          right="10"
          left="10">
    <s:Button label="Previous"/>

    <s:Label text="Total results:" />

    <s:Image height="28" width="100"
             source="myImage.png"
             baseline="-8"
             />

    <s:Spacer width="100%"/>

    <s:Button label="Next" />
</s:HGroup>

Upvotes: 1

Related Questions