Loading external images with variable heights in stacked rows

1

I want to load multiple images from an xml document into rows, one on top the other on a y axis?

here is my xml:


     <?xml version="1.0" encoding="UTF-8"?>
<cardRewards>
    <rewardImage path="images/redStar1.jpg" />
    <rewardImage path="images/redStar2.jpg" />
    <rewardImage path="images/redStar3.jpg" />
    <rewardImage path="images/redStar4.jpg" />
</cardRewards>

and then in my actionscript i have this:

 ActionScript Code:

    
[LEFT][COLOR=#f000f0]*//load images into scroller*[/COLOR]
[COLOR=#993300]var[/COLOR] cardInfo:[COLOR=#993300]XML[/COLOR]= [COLOR=#993300]new[/COLOR] [COLOR=#993300]XML[/COLOR][COLOR=#000000]([/COLOR][COLOR=#000000])[/COLOR];

cardInfo.[COLOR=#993300]ignoreWhite[/COLOR]=[COLOR=#993300]true[/COLOR];

cardInfo.[COLOR=#993300]onLoad[/COLOR]=[COLOR=#993300]function[/COLOR][COLOR=#000000]([/COLOR]success[COLOR=#000000])[/COLOR][COLOR=#000000]{[/COLOR]
    [COLOR=#993300]if[/COLOR][COLOR=#000000]([/COLOR]success[COLOR=#000000])[/COLOR][COLOR=#000000]{[/COLOR]
        [COLOR=#993300]var[/COLOR] xnRoot:[COLOR=#993300]XMLNode[/COLOR]=[COLOR=#993300]this[/COLOR].[COLOR=#993300]firstChild[/COLOR];
        [COLOR=#993300]var[/COLOR] xnImage:[COLOR=#993300]XMLNode[/COLOR];
        [COLOR=#993300]var[/COLOR] prevHeight:[COLOR=#993300]Number[/COLOR]=[COLOR=#000000]0[/COLOR];
        [COLOR=#993300]for[/COLOR][COLOR=#000000]([/COLOR]i:[COLOR=#993300]Number[/COLOR]=[COLOR=#000000]0[/COLOR]; i<xnRoot.[COLOR=#993300]childNodes[/COLOR].[COLOR=#993300]length[/COLOR]; i++[COLOR=#000000])[/COLOR][COLOR=#000000]{[/COLOR]
            xnImage=xnRoot.[COLOR=#993300]childNodes[/COLOR][COLOR=#000000][[/COLOR]i[COLOR=#000000]][/COLOR];
            xnImagePath=xnImage.[COLOR=#993300]attributes[/COLOR].[COLOR=#000000]path[/COLOR];
            [COLOR=#993300]var[/COLOR] image:[COLOR=#993300]MovieClip[/COLOR] = scroller.[COLOR=#000000]contentMain[/COLOR].[COLOR=#993300]createEmptyMovieClip[/COLOR][COLOR=#000000]([/COLOR][COLOR=#0000ff]"image"[/COLOR]+i, scroller.[COLOR=#000000]contentMain[/COLOR].[COLOR=#993300]getNextHighestDepth[/COLOR][COLOR=#000000]([/COLOR][COLOR=#000000])[/COLOR][COLOR=#000000])[/COLOR];
            [COLOR=#993300]var[/COLOR] mclListener:[COLOR=#993300]Object[/COLOR] = [COLOR=#993300]new[/COLOR] [COLOR=#993300]Object[/COLOR][COLOR=#000000]([/COLOR][COLOR=#000000])[/COLOR];
            mclListener.[COLOR=#993300]onLoadInit[/COLOR] = [COLOR=#993300]function[/COLOR][COLOR=#000000]([/COLOR]target_mc:[COLOR=#993300]MovieClip[/COLOR][COLOR=#000000])[/COLOR] [COLOR=#000000]{[/COLOR]
    [COLOR=#993300]trace[/COLOR][COLOR=#000000]([/COLOR]image.[COLOR=#993300]_height[/COLOR][COLOR=#000000])[/COLOR];
    [COLOR=#993300]trace[/COLOR][COLOR=#000000]([/COLOR]image[COLOR=#000000])[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#993300]var[/COLOR] image_mcl:[COLOR=#993300]MovieClipLoader[/COLOR] = [COLOR=#993300]new[/COLOR] [COLOR=#993300]MovieClipLoader[/COLOR][COLOR=#000000]([/COLOR][COLOR=#000000])[/COLOR];
image_mcl.[COLOR=#993300]addListener[/COLOR][COLOR=#000000]([/COLOR]mclListener[COLOR=#000000])[/COLOR];
image_mcl.[COLOR=#993300]loadClip[/COLOR][COLOR=#000000]([/COLOR]xnImagePath, image[COLOR=#000000])[/COLOR];
        [COLOR=#000000]}[/COLOR]
        
    [COLOR=#000000]}[/COLOR]
[COLOR=#000000]}[/COLOR]
cardInfo.[COLOR=#993300]load[/COLOR][COLOR=#000000]([/COLOR][COLOR=#0000ff]"redCardInfo.xml"[/COLOR][COLOR=#000000])[/COLOR];[/LEFT]

right now i’m just trying to trace each image name and it’s height through the for loop, but what i would like to do is stack each image, 1 following the other.

when i run the trace, the output repeats just the last images name and image height. There is something wrong in my loop, right? Also i should mention that each image has a different height dimension.

Any help would be much appreciated.