Wie kann ich Canvases in einer Vbox ziehen und ablegen, um sie neu zu ordnen?

Question

Ich bin mit Flex auf dem Laufenden und ich suche nach einem Beispiel für die Implementierung einer Drag-and-Drop-Umsortierung in einem Vbox-Container. Grundsätzlich habe ich eine Vbox, die eine Reihe von Canvas's enthält, die volle Breite und 35px hoch sind. Ich möchte in der Lage sein, sie per Drag-and-Drop in der vbox neu zu ordnen.

Jede Hilfe sehr geschätzt wird - dank,

b

Answer 1

Haben Sie versucht, eine mx mit: List - Drag & Drop-Unterstützung bereits in und sehr einfach aufgebaut ist zu verwenden - ich warf zusammen eine Probe für Sie die Dimensionen verwenden Sie erwähnt:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()"> 

    <mx:Script> 
     <![CDATA[ 
      import mx.controls.Alert; 
      import mx.events.DragEvent; 
      import mx.collections.ArrayCollection; 

      [Bindable] 
      private var _source:ArrayCollection = new ArrayCollection(); 

      private function init():void{ 

       var n:int = 10; 
       for(var i:int = 0; i < n; i++){ _source.addItem({value:Math.random()}); } 

      } 

      private function handleReorder(event:DragEvent):void{ 

       Alert.show("A change was made!"); 

      } 

     ]]> 
    </mx:Script> 

    <mx:List dataProvider="{_source}" width="250" height="500" dragMoveEnabled="true" 
      dragEnabled="true" dropEnabled="true" dragDrop="handleReorder(event)"> 
     <mx:itemRenderer> 
      <mx:Component> 
       <mx:Canvas width="100%" height="35"> 
        <mx:Text text="{data.value}" width="100%" height="100%" selectable="false" /> 
       </mx:Canvas> 
      </mx:Component> 
     </mx:itemRenderer> 
    </mx:List> 

</mx:Application> 

Und es gibt natürlich mehr Infos hier: http://livedocs.adobe.com/flex/3/langref/mx/controls/List.html

viel Glück!

Answer 2

Wenn ich Sie wäre, würde ich zuerst die Dokumentation Flex am Check-out online. Es gibt this Beispiel. Sie müssen dies für den Iditmeditor Ihrer Listensteuerung anpassen. Es gibt noch eine weitere example, die Sie sich ansehen sollten. Wenn Sie ein Problem haben, lassen Sie es uns wissen.