Home Tutorial Flex Flex4 Components Drag and Drop between two list control in Flex4

 
 

Share on Google+Share on Google+
Drag and Drop between two list control in Flex4
Posted on: July 12, 2010 at 12:00 AM
Advertisement
In this example you can see how the data items of list are drag and drop from one list to another list.

Drag and Drop between two list control in Flex4:

In this example you can see how the data items of list are drag and drop from one list to another list.  Dragging and dropping is simple between two list control because the the component use the same data format.

Example:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx"

minWidth="955" minHeight="600"

creationComplete="itemData();">

<fx:Script>

<![CDATA[

import mx.collections.ArrayList;

private function itemData():void {

Item.dataProvider =

new ArrayList(['Cold Drink', 'Peties',

'Pestry','Chips','Cream Roll','Veg Roll']);

buyItem.dataProvider = new ArrayList([]);

}

]]>

</fx:Script>

<s:Panel title="Drag and drop between two list control"

chromeColor="#555555"

color="#CCCCCC" width="311" height="225" backgroundColor="#93AE93">

<s:Label text="List of Item"

x="17" y="10"

color="#000000"

fontFamily="Verdana"/>

<s:Label text="Choose item for buy"

x="155" y="10"

color="#000000"

fontFamily="Verdana"/>

<s:VGroup x="21" y="36" width="233" horizontalAlign="center">

<s:HGroup>

<s:List id="Item"

allowMultipleSelection="true"

dragEnabled="true"

dragMoveEnabled="true"

color="#000000"

height="120"

contentBackgroundColor="#FFFBCF"/>

<s:Label text=">>" color="#000000"/>

<s:List id="buyItem"

dropEnabled="true"

color="#000000"

contentBackgroundColor="#FFFBCF"

height="120"/>

</s:HGroup>

<s:Button id="reset"

label="Reset"

click="itemData()"/>

</s:VGroup>

</s:Panel>

</s:Application>

Output:

Running Application:

To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.

Download this code

Advertisement

Related Tags for Drag and Drop between two list control in Flex4:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: July 12, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com