Wednesday, July 14, 2010

Image Drager

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"  borderColor="#4E5051" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#4D4D4D, #7E7D7D]" creationComplete="datalink.send(); init();" >
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import flash.sampler.DeleteObjectSample;
import mx.containers.Panel;
import mx.containers.Canvas;
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.core.DragSource;
import mx.controls.Image;
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
import mx.core.Application;

[Bindable]
private var arraycollect:ArrayCollection;
private var dropimage:String;
private var imgdisplay:Image;
private var xpos:Number;
private var ypos:Number;
private var selectedobj:Object=new Object();
private var cm:ContextMenu=new ContextMenu();
private var imagesource:String=new String();
private var imagexpotition:int=new int();
private var imageypotition:int=new int();


      
private function imagestoragearea(evt:ResultEvent):void
{
arraycollect=evt.result.imagelist.image

}

public function mousemoveimag(event:MouseEvent):void
{
            var draginitiator:Image=event.currentTarget as Image;
var ds:DragSource=new DragSource();
   ds.addData(draginitiator,"img");  
DragManager.doDrag(draginitiator,ds,event);
dropimage=(event.currentTarget as Image).source.toString();
    }

private function dragAccept(event:DragEvent):void

{
 var dropTarget:Canvas = event.currentTarget as Canvas;
 DragManager.acceptDragDrop(dropTarget);
}

private function dragDrop(event:DragEvent):void

{
imgdisplay = new Image();
            imgdis.addChild(imgdisplay);
   imgdisplay.source=dropimage;
   textamount.text=String(imgdis.numChildren);
   //xpositon.text=String(imgdis.mouseX);
            imgdisplay.x=imgdis.mouseX;
   imgdisplay.y=imgdis.mouseY;
imgdisplay.addEventListener(MouseEvent.MOUSE_DOWN, movedown);
        imgdisplay.addEventListener(MouseEvent.MOUSE_UP, moveupDrag);
        imgdisplay.addEventListener(MouseEvent.CLICK,selectitem);
        imgdisplay.contextMenu = cm;
    
         }
           private function movedown(evt:MouseEvent):void
           {
          
           evt.currentTarget.startDrag();
            
           }
           
  private function moveupDrag(evt:MouseEvent):void
           {
          
           evt.currentTarget.stopDrag();
          
           }
           
           
private function positoinchange(evt:MouseEvent):void
{
xpositon.text=(evt.currentTarget as Canvas).mouseX.toString();
ypositon.text=(evt.currentTarget as Canvas).mouseY.toString();
}


 private function contextMenuItem_menuItemSelect(evt:ContextMenuEvent):void 
    {
      imagesource=selectedobj.source.toString();
      imagexpotition=selectedobj.x;
      imageypotition=selectedobj.y;
          
      imgdis.removeChild(selectedobj as Image);
      undobutton.enabled=true;
      textamount.text=String(imgdis.numChildren);
    
    
    } 
    
private function init():void
{
         
           var cmi:ContextMenuItem = new ContextMenuItem("Remove", true);
           var cmiimage:ContextMenuItem = new ContextMenuItem("Undo", true)
           cmiimage.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,undoimage);
                cmi.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_menuItemSelect);
                cm = new ContextMenu();
                cm.hideBuiltInItems();
                cm.customItems = [cmi,cmiimage];
}




private function selectitem(event:MouseEvent):void
 {

selectedobj=event.currentTarget as Image;

 }
 private function undoimage(event:MouseEvent):void
 {
 
imgdisplay = new Image();
            imgdis.addChild(imgdisplay);
   imgdisplay.source=imagesource;
   textamount.text=String(imgdis.numChildren);
   //xpositon.text=String(imgdis.mouseX);
            imgdisplay.x=imagexpotition;
   imgdisplay.y=imageypotition;
   imgdisplay.addEventListener(MouseEvent.MOUSE_DOWN, movedown);
        imgdisplay.addEventListener(MouseEvent.MOUSE_UP, moveupDrag);
        imgdisplay.addEventListener(MouseEvent.CLICK,selectitem);
        imgdisplay.contextMenu = cm;
        undobutton.enabled=false;


 }
    
]]>
</mx:Script>


    <mx:HTTPService id="datalink" url="assets/imageXML.xml" result="imagestoragearea(event)"/>
<mx:Panel x="797" y="52" width="212" height="319" layout="absolute" title="Image Loader">
<mx:TileList dataProvider="{arraycollect}" itemRenderer="imagecompo" y="-10" x="-10"/>
    </mx:Panel>
<mx:Panel x="796" y="373" width="212" height="196" layout="absolute" title="Position">
<mx:Label x="10" y="33" text="X:" fontSize="14" fontWeight="bold" fontFamily="Arial"/>
<mx:Label x="10" y="83" text="Y:" fontWeight="bold" fontSize="14" fontFamily="Arial"/>
<mx:TextInput x="36" y="34" id="xpositon" width="53" editable="false"/>
<mx:TextInput x="36" y="84" id="ypositon" width="53" editable="false"/>
<mx:Button x="24" y="127" label="Undo" id="undobutton" click="undoimage(event);"/>
</mx:Panel>
<mx:Canvas  x="0" y="52"  width="779" height="517" id="imgdis" borderStyle="solid" borderColor="#8b8b8b" borderThickness="3" backgroundColor="#ffffff"
     dragEnter="dragAccept(event)" dragDrop="dragDrop(event)" mouseMove="positoinchange(event);">
</mx:Canvas>
<mx:TextInput x="619" y="577" id="textamount" editable="false"/>
<mx:Label x="568" y="577" text="Total" width="49" height="22" fontSize="15" fontWeight="bold" color="#FCFEFF"/>
    </mx:Application>

<--------custom component for Image-------->

<?xml version="1.0" encoding="utf-8"?>
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml" mouseDown="Application.application.mousemoveimag(event);" source="{data.subimg1}" width="100" height="100">
<mx:Script>
<![CDATA[
import mx.core.Application;
]]>
</mx:Script>
</mx:Image>

OUT PUT



No comments:

Post a Comment