深度處理使用Flex 4

Question

我在Flex 4的一個這樣的代碼

<!-- 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> 

主要是它的一個MX：帆布具有裏面reapeaters爲我創建了多個自定義組件。大多數這些自定義組件是這樣的：

<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)" > 

一切工作正常（x，y，寬度，高度，旋轉），除了深度！

似乎無論數字是什麼，它顯示爲它在父容器中呈現的順序。 （MX：帆布）！

我想獲得的是相對於彼此，mx：Canvas中的所有項目都按分配給它們的「深度」順序顯示。

我該怎麼做？

Answer 1

您正在使用中繼器;這本質上是一個循環。

聽起來好像您要求循環播放項目，但是按不同順序處理這些項目。那是對的嗎？

我的第一個建議是，你會研究如何在轉發器「運行」之前按照深度對dataProvider項進行排序。

我的第二個建議是你不使用中繼器。由於渲染器回收，基於列表的類將爲您提供更好的性能。

如果你真的需要一次創建所有的孩子，我的第三個建議是，你轉移到一個ActionScript實現，它可以讓你更精確地控制事物創建的方式和時間。

每當我使用了一箇中繼器，我一直不高興。

---

這裏是lists and itemRenderers一些信息使用Flex 4

這是我會如何修改此示例使用一個列表，而不是一箇中繼器的粗略估計：

<!-- START >>> middle part: items --> 
    <mx:Canvas id="itemContainer" 
       width="100%" 
       height="100%"> 
     <!-- START >>> Items Display on the page --> 
     <s:List id="richTextList" 
        dataProvider="{_model.current_day.richTextNotes}" 
        itemRenderer="com.something.myComponent"> 
     </s:List> 
    </mx:Canvas> 

的itemRenderer可能是這樣的：

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:s="library://ns.adobe.com/flex/spark"> 
    <s:SkinnableContainer rotation="{data.rotation}" 
    creationComplete="skinnablecontainer1_creationCompleteHandler(event)" /> 
</s:ItemRenderer> 

該列表將確定寬度，渲染器的x和y位置。在大多數情況下，它也會決定身高;儘管Flex 3列表有variableRowHeight選項。

如果你想使用基於OND ATA不同的渲染器，考慮使用一個itemRendererFunction