// custom component, say the name is: AssetDataGrid

<?xml version="1.0"?>
<mx:DataGrid xmlns:mx="http://www.adobe.com/2006/mxml">

	<mx:Script>
		<![CDATA[
		import mx.controls.dataGridClasses.DataGridDragProxy;
		import mx.core.IUIComponent;

		import prj.ui.*;

		/**
		* @public
		* class to use as DragProxy image
		*/
		[Bindable]
		public var dragProxy:Class = DataGridDragProxy; //set the default value to the standard DataGridDragProxy class

		override protected function get dragImage():IUIComponent {
			var dgdp:IUIComponent = new dragProxy();
			dgdp.owner = this;
			return dgdp;
		}
		]]>
	</mx:Script>
</mx:DataGrid>

// DataGridDragProxy extended class, AssetDragProxy

package prj.ui {

    import flash.display.*;

    import mx.core.*;
    import mx.controls.*;
	import mx.controls.dataGridClasses.DataGridDragProxy;
    import mx.controls.listClasses.IListItemRenderer;

	import prj.ui.*;

    public class AssetDragProxy extends DataGridDragProxy {

		[Embed(source="/../assets/stock/layout.png")]
		[Bindable]
		private var LayoutIcon:Class; // custom drag icon

		/**
		 * the constructor
		 */
        public function AssetDragProxy():void {
            super();
        }

        override protected function createChildren():void {

        	super.createChildren();

        	var do2dContent:* = getChildAt(0);

        	while (do2dContent.numChildren) 
        		do2dContent.removeChildAt(0); // remove all unuseful children, be aware of the mask concerns if your are going to put cumbersome stuff

            var items:Array = AssetDataGrid(owner).selectedIndices;
            var dg:AssetDataGrid = AssetDataGrid(owner);

			// your stuff here
            var item:Object = dg.dataProvider[items[0]];
            var label:UITextField = new UITextField();
            label.text = item.name;
            label.x = 16;

			var bmp:Bitmap = new LayoutIcon() as Bitmap;
            do2dContent.addChild(bmp);
            do2dContent.addChild(label);

            x = this.mouseX - 15;
        }
    }
}

// demo:
// files: src
//         |_ DemoApp.mxml
//              |_ prj
//                  |_ ui
//                     |_ AssetDataGrid.mxml
//                     |_ AssetDragProxy.as

<?xml version="1.0"?>
<mx:Application
	xmlns:mx="http://www.adobe.com/2006/mxml"
	xmlns:ui="prj.ui.*"  width="100%" height="100%">

	<mx:ArrayCollection id="stubDataset">
		<mx:Object name="child_play.png" width="150" height="100" size="35616" />
		<mx:Object name="toy.png" width="480" height="250" size="586566" />
		<mx:Object name="playground.png" width="320" height="240" size="135648" />
		<mx:Object name="teacher.jpg" width="600" height="350" size="385616" />
		<mx:Object name="funny_dog.jpg" width="532" height="412" size="412616" />
	</mx:ArrayCollection>

	<mx:Panel width="100%" height="100%" label="custom datagrid drag image">
		<ui:AssetDataGrid id="dgImages"
						  dataProvider="{stubDataset}"
						  width="100%" height="100%"
			 			  dragProxy="prj.ui.AssetDragProxy"
						  dragEnabled="true">
			<ui:columns>
				<mx:DataGridColumn dataField="name" headerText="file name"/>
				<mx:DataGridColumn dataField="width" headerText="width" width="40" />
				<mx:DataGridColumn dataField="height" headerText="height" width="40" />
				<mx:DataGridColumn dataField="size" headerText="size" width="60"/>
			</ui:columns>
		</ui:AssetDataGrid>
	</mx:Panel>
</mx:Application>

// please note that datagrid columns inherits from the custom component, don't use mx

* inspired by: http://www.dgrigg.com/post.cfm/11/03/2006/DataGrid-Drag-Image