I have a code in Flex 4 like this
<!-- START >>> middle part: items -->
<mx:Canvas id="itemContainer"
width="100%"
height="100%">
<!-- START >>> Items Display on the page -->
<mx:Repeater id="richTextReapeater"
dataProvider="{_model.current_day.richTextNotes}">
<components:RichTextNoteDisplay theNote="{richTextReapeater.currentItem}" />
</mx:Repeater>
<mx:Repeater id="postItReapeater"
dataProvider="{_model.current_day.positNotes}">
<components:PostItNoteDisplay theNote="{postItReapeater.currentItem}" />
</mx:Repeater>
......
</mx:Canvas>
Mainly it's a MX:Canvas that has inside it reapeaters for multiple custom components I created. Most of these custom components are like this:
<s:SkinnableContainer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
x="{theNote.x}"
y="{theNote.y}"
width="{theNote.width}"
height="{theNote.height}"
depth="{theNote.depth}"
rotation="{theNote.rotation}"
creationComplete="skinnablecontainer1_creationCompleteHandler(event)" >
Everything works fine (x,y,width,height,rotation) except for depth!
it seems that regardless what the number is it shows as the order it was rendered in the parent container. (MX:Canvas)!
What I want to acheive is that relative to each others, all the items in the mx:Canvas shows in the order of "depth" assigned to them.
How do I do this?