How to change the imagealpha for a multi-select drag and drop operation in Flex
Here's the code that allows multi-select list to drag into a tree area.  What I would like to do is to change the alpha of the image that gets dragged around.  I've done some research but most of the discussions out there talk about how to change the dragged image.  What I want to do is simply change the default alpha of the dragged item from 0.5 to say 0.2.  Also this solution should be able to handle multiple select dragging.  Thank you.

Below is a simple example of drag and drop that I would like to modify to allow for the alpha change of the draged item.


    <?xml version="1.0" encoding="utf-8"?>
<!-- working_with_tree_controls/TreeDragTo.mxml -->
<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">
	
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	
	<fx:Declarations>
		<fx:XML id="treeData" xmlns="">
			<root>
				<node label="Massachusetts" type="state" data="MA">
					<node label="Boston" type="city" >
						<node label="Smoke House Grill" type="restaurant" />
						<node label="Equator" type="restaurant" />
						<node label="Aquataine" type="restaurant" />
						<node label="Grill 23" type="restaurant" />
					</node>
					<node label="Provincetown" type="city" >
						<node label="Lobster Pot" type="restaurant" />
						<node label="The Mews" type="restaurant" />
					</node>
				</node>
				<node label="California" type="state" data="CA">
					<node label="San Francisco" type="city" >
						<node label="Frog Lane" type="restaurant" />
					</node>
				</node>
			</root>
		</fx:XML>   
		<fx:Array id="listData">
			<fx:String>Johnny Rocket's</fx:String>
			<fx:String>Jet Pizza</fx:String>
			<fx:String>Steve's Greek</fx:String>
			<fx:String>Sonsie</fx:String>
			<fx:String>The Border Cafe</fx:String>
		</fx:Array> 	
	</fx:Declarations>
	
	<fx:Script>
		<![CDATA[
			import mx.events.DragEvent;
			import mx.managers.DragManager;
			import mx.core.DragSource;
			import mx.core.UIComponent;
			import mx.controls.Tree;
			/**
			 * Called as soon as the dragProxy enters the target. You can add logic
			 * to determine if the target will accept the drop based on the
			 * dragInitiator, the data available in the dragSource, or whatever.
			 * Here the drop is blindly accepted.
			 */
			private function onDragEnter( event:DragEvent ) : void
			{
				DragManager.acceptDragDrop(UIComponent(event.currentTarget));
			}
			/**
			 * Called while the dragProxy is over the drop target. You can
			 * use this function to determine the type of feedback to show.
			 * Because the List is set to allow MOVE (the item is deleted
			 * once dropped), different feedback possibilities are given.
			 *
			 * Also, for this application, the Tree control node the dragProxy is
			 * over is selected. As the dragProxy moves, the Tree control's
			 * selection changes.
			 *
			 * A complexity in this application is that the drop is being allowed
			 * only over nodes whose type is NOT 'state'.
			 * The feedback is removed.
			 */
			private function onDragOver( event:DragEvent ) : void {
				var dropTarget:Tree = Tree(event.currentTarget);
				var r:int = dropTarget.calculateDropIndex(event);
				tree.selectedIndex = r;
				var node:XML = tree.selectedItem as XML;
				if ( node.@type == "state" ) {
					DragManager.showFeedback(DragManager.NONE);
					return;
				}
				if (event.ctrlKey)
					DragManager.showFeedback(DragManager.COPY);
				else if (event.shiftKey)
					DragManager.showFeedback(DragManager.LINK);
				else {
					DragManager.showFeedback(DragManager.MOVE);
				}
			}
			/**
			 * Called when the dragProxy is released
			 * over the drop target. The information in the dragSource
			 * is extracted and processed.
			 *
			 * The target node is determined and 
			 * all of the data selected (the List has allowMultipleSection
			 * set) is added.
			 */
			private function onDragDrop( event:DragEvent ) : void {
				var ds:DragSource = event.dragSource;
				var dropTarget:Tree = Tree(event.currentTarget);
				var items:Array = ds.dataForFormat("items") as Array;
				var r:int = tree.calculateDropIndex(event);
				tree.selectedIndex = r;
				var node:XML = tree.selectedItem as XML;
				var p:*;
				/* If the selected node has children (it is type==city),
				then add the items at the beginning. */
				if ( tree.dataDescriptor.hasChildren(node) ) {
					p = node;
					r = 0;
				} else {
					p = node.parent();
				}
				for (var i:Number=0; i < items.length; i++) {
					var insert:XML = <node />;
					insert.@label = items[i];
					insert.@type  = "restaurant";
					tree.dataDescriptor.addChildAt(p, insert, r+i);
				}
			}
			/**
			 * Called when the drag operation completes, whether 
			 * successfully or not. The tree is cleared of its
			 * selection.
			 */
			private function onDragComplete( event:DragEvent ) : void {
				tree.selectedIndex = -1;
			}       
		]]>
	</fx:Script>    
	
	<s:Panel x="48" y="125" width="447" height="351" title="Drag onto Tree"> 
		<mx:Tree width="186" left="10" top="10" bottom="10" id="tree"
				 labelField="@label"
				 dataProvider="{treeData.node}"
				 dropEnabled="false"
				 dragMoveEnabled="false"
				 dragEnter="onDragEnter(event)"
				 dragOver="onDragOver(event)"
				 dragDrop="onDragDrop(event)">
		</mx:Tree>      
		<mx:List width="188" height="206" right="10" bottom="10" id="list"
				 allowMultipleSelection="true"
				 dataProvider="{listData}"
				 dragEnabled="true"
				 dragMoveEnabled="true"
				 dragComplete="onDragComplete(event)">
		</mx:List>      
		<s:Label x="229" y="10" text="Drag from the list below to the tree" 
				 width="188" height="39"/>
		<s:Label x="229" y="69" text="restaurants"/>
	</s:Panel> 
</s:Application>



How to change the imagealpha for a multi-select drag and drop operation in Flex
===

Here's the code that allows multi-select list to drag into a tree area.  What I would like to do is to change the alpha of the image that gets dragged around.  I've done some research but most of the discussions out there talk about how to change the dragged image.  What I want to do is simply change the default alpha of the dragged item from 0.5 to say 0.2.  Also this solution should be able to handle multiple select dragging.  Thank you.

Below is a simple example of drag and drop that I would like to modify to allow for the alpha change of the draged item.


    <?xml version="1.0" encoding="utf-8"?>
<!-- working_with_tree_controls/TreeDragTo.mxml -->
<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">
	
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	
	<fx:Declarations>
		<fx:XML id="treeData" xmlns="">
			<root>
				<node label="Massachusetts" type="state" data="MA">
					<node label="Boston" type="city" >
						<node label="Smoke House Grill" type="restaurant" />
						<node label="Equator" type="restaurant" />
						<node label="Aquataine" type="restaurant" />
						<node label="Grill 23" type="restaurant" />
					</node>
					<node label="Provincetown" type="city" >
						<node label="Lobster Pot" type="restaurant" />
						<node label="The Mews" type="restaurant" />
					</node>
				</node>
				<node label="California" type="state" data="CA">
					<node label="San Francisco" type="city" >
						<node label="Frog Lane" type="restaurant" />
					</node>
				</node>
			</root>
		</fx:XML>   
		<fx:Array id="listData">
			<fx:String>Johnny Rocket's</fx:String>
			<fx:String>Jet Pizza</fx:String>
			<fx:String>Steve's Greek</fx:String>
			<fx:String>Sonsie</fx:String>
			<fx:String>The Border Cafe</fx:String>
		</fx:Array> 	
	</fx:Declarations>
	
	<fx:Script>
		<![CDATA[
			import mx.events.DragEvent;
			import mx.managers.DragManager;
			import mx.core.DragSource;
			import mx.core.UIComponent;
			import mx.controls.Tree;
			/**
			 * Called as soon as the dragProxy enters the target. You can add logic
			 * to determine if the target will accept the drop based on the
			 * dragInitiator, the data available in the dragSource, or whatever.
			 * Here the drop is blindly accepted.
			 */
			private function onDragEnter( event:DragEvent ) : void
			{
				DragManager.acceptDragDrop(UIComponent(event.currentTarget));
			}
			/**
			 * Called while the dragProxy is over the drop target. You can
			 * use this function to determine the type of feedback to show.
			 * Because the List is set to allow MOVE (the item is deleted
			 * once dropped), different feedback possibilities are given.
			 *
			 * Also, for this application, the Tree control node the dragProxy is
			 * over is selected. As the dragProxy moves, the Tree control's
			 * selection changes.
			 *
			 * A complexity in this application is that the drop is being allowed
			 * only over nodes whose type is NOT 'state'.
			 * The feedback is removed.
			 */
			private function onDragOver( event:DragEvent ) : void {
				var dropTarget:Tree = Tree(event.currentTarget);
				var r:int = dropTarget.calculateDropIndex(event);
				tree.selectedIndex = r;
				var node:XML = tree.selectedItem as XML;
				if ( node.@type == "state" ) {
					DragManager.showFeedback(DragManager.NONE);
					return;
				}
				if (event.ctrlKey)
					DragManager.showFeedback(DragManager.COPY);
				else if (event.shiftKey)
					DragManager.showFeedback(DragManager.LINK);
				else {
					DragManager.showFeedback(DragManager.MOVE);
				}
			}
			/**
			 * Called when the dragProxy is released
			 * over the drop target. The information in the dragSource
			 * is extracted and processed.
			 *
			 * The target node is determined and 
			 * all of the data selected (the List has allowMultipleSection
			 * set) is added.
			 */
			private function onDragDrop( event:DragEvent ) : void {
				var ds:DragSource = event.dragSource;
				var dropTarget:Tree = Tree(event.currentTarget);
				var items:Array = ds.dataForFormat("items") as Array;
				var r:int = tree.calculateDropIndex(event);
				tree.selectedIndex = r;
				var node:XML = tree.selectedItem as XML;
				var p:*;
				/* If the selected node has children (it is type==city),
				then add the items at the beginning. */
				if ( tree.dataDescriptor.hasChildren(node) ) {
					p = node;
					r = 0;
				} else {
					p = node.parent();
				}
				for (var i:Number=0; i < items.length; i++) {
					var insert:XML = <node />;
					insert.@label = items[i];
					insert.@type  = "restaurant";
					tree.dataDescriptor.addChildAt(p, insert, r+i);
				}
			}
			/**
			 * Called when the drag operation completes, whether 
			 * successfully or not. The tree is cleared of its
			 * selection.
			 */
			private function onDragComplete( event:DragEvent ) : void {
				tree.selectedIndex = -1;
			}       
		]]>
	</fx:Script>    
	
	<s:Panel x="48" y="125" width="447" height="351" title="Drag onto Tree"> 
		<mx:Tree width="186" left="10" top="10" bottom="10" id="tree"
				 labelField="@label"
				 dataProvider="{treeData.node}"
				 dropEnabled="false"
				 dragMoveEnabled="false"
				 dragEnter="onDragEnter(event)"
				 dragOver="onDragOver(event)"
				 dragDrop="onDragDrop(event)">
		</mx:Tree>      
		<mx:List width="188" height="206" right="10" bottom="10" id="list"
				 allowMultipleSelection="true"
				 dataProvider="{listData}"
				 dragEnabled="true"
				 dragMoveEnabled="true"
				 dragComplete="onDragComplete(event)">
		</mx:List>      
		<s:Label x="229" y="10" text="Drag from the list below to the tree" 
				 width="188" height="39"/>
		<s:Label x="229" y="69" text="restaurants"/>
	</s:Panel> 
</s:Application>


