[flexcoders] bitmapdata and tileList Drag and drop

[thiruvengadam_dev]

Hi Friends

I am working on bitmap data, I am loading a images from a url and
copying it into tilest component as a itemrender , while I am trying
to drag and drop the itemrender which has the duplicated bitmap data,
the data is getting lost , and I am getting this error

ArgumentError: Error #2025: The supplied DisplayObject must be a child
of the caller.

What I want is to darg say 3rd element to  to the  1st position,
please help this.

Bellow is the code

<?xml version="1.0" encoding="utf-8"?>
<!--
http://blog.flexexamples.com/2007/08/03/duplicating-images-using-the-...
-->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white" >

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

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

            function loadImages()
            {
                //img1.load("assets/logo.png");
                dupeImage(img1);
            }

            private function dupeImage(source:Image):void {
                trace('source ' + source.content);
                var data:BitmapData =
Bitmap(source.content).bitmapData;
                var bitmap:Bitmap = new Bitmap(data);
                                trace('bitmap ' + bitmap);
                arrColl.addItem({image:bitmap, label:"item #" +
(arrColl.length + 1)});
            }
        ]]>
    </mx:Script>

    <mx:HBox>
        <mx:Panel title="Source image">
            <mx:HBox verticalAlign="middle" horizontalAlign="center"
width="100%" height="100%">
                <mx:Image id="img1" source="assets/logo.png"
creationComplete="loadImages();"/>
            </mx:HBox>

            <mx:ControlBar>
                <mx:Button label="Copy image" click="dupeImage(img1)" /

            </mx:ControlBar>
        </mx:Panel>

        <mx:TileList id="tileList"
                dataProvider="{arrColl}"
                width="300" height="200"
                columnCount="4"
                verticalScrollPolicy="on"
                 dragEnabled="true" dropEnabled="true"
                  mouseEnabled="true"
                >
            <mx:itemRenderer>
                <mx:Component>
                    <mx:VBox>
                        <mx:Image source="{data.image}" />
                        <mx:Label text="{data.label}" />
                    </mx:VBox>
                </mx:Component>
            </mx:itemRenderer>
        </mx:TileList>
    </mx:HBox>

</mx:Application>