2011-12-20 55 views
-2

我的Flex應用程序中附有ArrayCollection(元素)的s:List。 我想改變一個元素的位置,所以實際上我改變它的項目索引,問題是,如何做這種動作?Flex 4:更改s中的元素位置:列表

這裏是一個更好的例子:

項目1 I:1個 項目2 I:2 項目3 I:3 項目4 I:4

I =指數

在項目內部有一個名爲「Up」的按鈕,例如,當我在項目3上登錄時,它變成這樣:

項目1 i:1 項目3 I:2 項目2 I:3 第4項I:4

所以我們可以看到,我們有第3項新的索引...

我怎樣才能做到這一點動作並看到該項目在界面中移動。

Thx!

+2

我不知道你爲什麼不發表你試過的細節。這個問題看起來像你試圖讓別人爲你做你的工作。閱讀[常見問題],這些問題不感激 – 2011-12-20 17:02:55

回答

1

第一件事情,你應該做的,當你看到一個ArrayCollection連接被看到的DOCUMENTATION

你會看到它有一個像addItemAtremoveItemAt

方法,使得明顯的事情是:

private function moveUp(collection:ArrayCollection, indexToMove:int, numPlaces:int=1) { 
    var newIndex:int = indexToMove - numPlaces; 
    if(newIndex < 0) { 
     newIndex = 0; 
    } 
    var itemToMove:Object = collection.removeItemAt(indexToMove); 
    collection.addItemAt(itemToMove, newIndex); 
} 
1

如果你的ArrayCollection被綁定到你的列表中,我將直接改變ArrayCollection的是這樣的:

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx"> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 
      import mx.events.FlexEvent; 

      [Bindable] 
      public var elements:ArrayCollection = new ArrayCollection([ 
       {label : "item 1"}, 
       {label : "item 2"}, 
       {label : "item 3"}, 
       {label : "item 4"} 
      ]); 

      public function moveUp(event:MouseEvent):void 
      { 
       var index:Number = myList.selectedIndex; 

       if (index > 0) {     
        var obj:Object = elements.getItemAt(index); 
        var newPos:Number = index - 1; 

        elements.removeItemAt(index); 
        elements.addItemAt(obj, newPos); 

        myList.selectedIndex = newPos; 
       } 
      } 


      public function moveDown(event:MouseEvent):void 
      { 
       var index:Number = myList.selectedIndex; 

       if (index < elements.length - 1) { 
        var obj:Object = elements.getItemAt(index); 
        var newPos:Number = index + 1; 

        elements.removeItemAt(index); 
        elements.addItemAt(obj, newPos); 

        myList.selectedIndex = newPos; 
       } 
      } 

     ]]> 
    </fx:Script> 

    <s:layout> 
     <s:VerticalLayout/> 
    </s:layout> 

    <s:List id="myList" labelField="label" dataProvider="{elements}"/> 

    <s:HGroup> 
     <s:Button label="Move up" click="moveUp(event)"/> 
     <s:Button label="Move down" click="moveDown(event)"/> 
    </s:HGroup> 

</s:WindowedApplication> 

現在,您可以使用調用父函數或自定義事件從自定義列表項呈示器中應用相同的邏輯。祝你好運!

2

在上面的答案中,通過將SelectedItem列表設置爲Selected Obj而不是將List的selectedIndex設置爲newPos,我們不需要顯式更改或維護ArrayCollection中的任何選擇。

public function moveUp(event:MouseEvent):void var index:Number = myList.selectedIndex;

  if (index > 0) {     
       var obj:Object = elements.getItemAt(index); 
       var newPos:Number = index - 1; 

       elements.removeItemAt(index); 
       elements.addItemAt(obj, newPos); 

       myList.selectItem = obj; (instead of myList.selectedIndex = newPos;) 
      } 
     }