My Editor

<?xml version="1.0" encoding="utf-8"?>
<mx:Application creationComplete="init()"  xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #FFFFFF]">
<mx:Script>
<![CDATA[
import mx.managers.PopUpManager;
import com.roguedevelopment.objecthandles.ObjectHandles;
import mx.controls.TextArea;
import mx.managers.PopUpManager;
import mx.managers.DragManager;
import mx.events.DragEvent;
import flash.events.MouseEvent;
import mx.core.DragSource;
private var cm:ContextMenu;
private var originalMenu : ContextMenu; 
private var fileadd:FileReferenceList=new FileReferenceList();

<-------- Rectangle Components-------->

public function recta():void
{
var rct:comRectangle=new comRectangle();
var obh:ObjectHandles=new ObjectHandles();
obh.allowVResize=true;
obh.allowHResize=true;
rct.percentHeight=100;
rct.percentWidth=100;
obh.width=100;
obh.height=100;
obh.addChild(rct);
can.addChild(obh);
}


            <-------- Circle Components-------->
            
            public function circle():void
            {
             var crl:comCircle=new comCircle();
             var obh:ObjectHandles=new ObjectHandles();
             obh.allowHResize=true;
             obh.allowVResize=true;
             //obh.setStyle('backgroundColor','cp.selectedColor');
             crl.percentHeight=100;
             crl.percentWidth=100;
             obh.height=100;
             obh.width=100;
             obh.x=150;
             obh.y=100;
             obh.addChild(crl);
             can.addChild(obh);
            
            }
            
            <-------- Line Components-------->
            
            public function line():void
            {
             var lne:comLine=new comLine();
             var obh:ObjectHandles=new ObjectHandles();
obh.allowVResize=true;
obh.allowHResize=true;
obh.allowRotate=true;
lne.percentHeight=100;
lne.percentWidth=100;
obh.width=100;
obh.height=10;
obh.addChild(lne);
can.addChild(obh);

            }
            
            <-------- Text Components-------->
            
            public function textA():void
            {
             var ta:T1=new T1();
             var obh:ObjectHandles=new ObjectHandles();
             obh.allowHResize=true;
             obh.allowVResize=true;
            
             obh.addChild(ta);
             can.addChild(ta);
            
            }
            public function Clear():void
            {
             can.removeAllChildren();
            
            
            }
            public function canvas():void
            {
             can.visible=true;
            }
            
            <-------- Image Components-------->
            
            public function load():void
            {
             var imgrot:comImageRotation=new comImageRotation();
             var obh:ObjectHandles=new ObjectHandles();
             obh.allowRotate=true;
             obh.x=150;
             obh.y=100;
             obh.addChild(imgrot);
             can.addChild(obh);
            }
          private function init():void{ 
                Application.application.contextMenu.hideBuiltInItems(); 
                
                var defaultItems:ContextMenuBuiltInItems = Application.application.contextMenu.builtInItems; 
                defaultItems.print = true; 
                var custLinkItem : ContextMenuItem = new 
                ContextMenuItem('Remove');
                //removeChild(can); 
                 Application.application.contextMenu.customItems.push(custLinkItem); 
                custLinkItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, goCustBtn); 
                originalMenu = Application.application.contextMenu; 
            } 
            private function goCustBtn(event:ContextMenuEvent):void{ 
                //event for the custom button 
            } 
            
            public function Img():void
            {
             var pop:comp=new comp();
             PopUpManager.addPopUp(pop,this,true);
             PopUpManager.centerPopUp(pop);
            }
            public function file():void
            {
             fileadd.browse();
            }
             private function mouseMoveHandler(event:MouseEvent):void 
            {                
                var dragInitiator:TextArea=TextArea(event.currentTarget);
                var ds:DragSource = new DragSource();
                ds.addData(dragInitiator, "Tex");               


                DragManager.doDrag(dragInitiator, ds, event);
            }
            private function dragEnterHandler(event:DragEvent):void
             {
                if (event.dragSource.hasFormat("Tex"))
                {
                    DragManager.acceptDragDrop(Canvas(event.currentTarget));
                }
            }
            private function dragDropHandler(event:DragEvent):void 
            {
                TextArea(event.dragInitiator).x = 
                    (event.currentTarget).mouseX;
                TextArea(event.dragInitiator).y = 
                    (event.currentTarget).mouseY;
            }
            
             public function doZoom(event:MouseEvent):void
              {
                if (zoomAll.isPlaying) {
                    zoomAll.reverse();
                }
                else {
                    // If this is a ROLL_OUT event, play the effect backwards. 
                    // If this is a ROLL_OVER event, play the effect forwards.
                    zoomAll.play([event.target], event.type == MouseEvent.ROLL_OUT ? true : false);
                }
            }
            
            
]]>
</mx:Script>
<mx:Zoom id="zoomAll" zoomWidthTo="1" zoomHeightTo="1" zoomWidthFrom=".5" zoomHeightFrom=".5"  />

<mx:Canvas x="419" y="249" width="593" height="486" borderColor="#000000" backgroundColor="#95918C" borderStyle="solid" borderThickness="8">
<mx:Canvas backgroundColor="#FFFFFF" x="484" y="30" width="64" height="390" borderStyle="solid" borderColor="black" borderThickness="2">
<mx:Button x="11" y="28" width="34" height="35" icon="@Embed(source='img/14_select.png')" fillColors="[#FFFFFF, #726F6F]" color="white" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Cursor" alpha="1.0" borderColor="green"/>
<mx:Button click="textA()" x="11" y="65" width="34" height="34" icon="@Embed(source='img/format-text-italic.png')" fillColors="[#FFFFFF, #726F6F]" color="white" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Text" alpha="1.0" borderColor="green"/>
<mx:Button click="line()" x="11" y="102" width="34" height="28" icon="@Embed(source='img/Line.png')" fillColors="[#FFFFFF, #848181]" color="white" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Line" alpha="1.0" borderColor="green" fontWeight="bold"/>
<mx:Button click="recta()" x="11" y="133" width="34" height="28" icon="@Embed(source='img/rectangle.png')" fillColors="[#FFFFFF, #848181]" color="white" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Rectangle" alpha="1.0" borderColor="green" fontWeight="bold"/>
<mx:ColorPicker id="cp"   x="14" y="286" width="27" height="25" toolTip="ColorPicker" selectedColor="#FFFFFF"/>
<mx:Button click="circle()" x="12" y="167" width="32" height="28" icon="@Embed(source='img/Circle.png')" fillColors="[#FFFFFF, #848181]" color="white" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Circle" alpha="1.0" borderColor="green" fontWeight="bold"/>
<mx:Button click="Img()" x="12" y="242" toggle="true" width="31" height="28" fillColors="[#FFFFFF, #848181]" color="#080808" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Ellipse" label="#" fontWeight="bold" fontSize="20" alpha="1.0" borderColor="green" icon="@Embed(source='img/3x3_grid (1).png')"/>
<mx:Button click="file()" x="12" y="204" width="32" height="28" icon="@Embed(source='img/image-x-generic.png')" fillColors="[#FFFFFF, #848181]" color="white" fillAlphas="[0.5, 0.5, 0.5, 0.5]" toolTip="Circle" alpha="1.0" borderColor="green" fontWeight="bold"/>
<mx:Canvas x="0" y="0" width="100%" height="22" backgroundColor="#B3D9F7">
<mx:Label text="Tools" fontWeight="bold" x="10.5" y="0"/>
</mx:Canvas>

</mx:Canvas>
<mx:ApplicationControlBar x="0" y="420" width="577" height="46" fillAlphas="[1.0, 1.0]" fillColors="[#95918C, #95918C]">
<mx:Button click="Clear()" label="Clear"/>
</mx:ApplicationControlBar>
<mx:Label x="29" y="-2" text="MY EDITOR" fontWeight="bold" fontSize="18" color="#A0D9F4"/>
<mx:Button click="load()" label="Image" x="188" y="70"/>
<mx:Canvas id="can"  click="canvas()"  dragEnter="dragEnterHandler(event)" dragDrop="dragDropHandler(event)" rollOver="doZoom(event)"
      rollOut="doZoom(event)" x="32" y="30" width="450" height="390" backgroundColor="{cp.selectedColor}" borderColor="black" borderThickness="2" borderStyle="solid">
</mx:Canvas>
</mx:Canvas>

</mx:Application>




SCREEN SHOT & DEMO HERE

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

Circle

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" borderStyle="solid" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #DFDFDF]"> <mx:Script> <![CDATA[ import mx.core.Container;    private var xpos:int;    private var ypos:int;    private var rad:int; private function onMouseDown(event:MouseEvent):void { xpos=(event.currentTarget as Container).mouseX; ypos=(event.currentTarget as Container).mouseY; } private function onMouseUp(event:MouseEvent):void { rad=((event.currentTarget as Container).mouseX-xpos)/2; graphicsHolder.graphics.beginFill(0xFF8800,1); graphicsHolder.graphics.drawCircle(xpos,ypos,rad);
} ]]> </mx:Script> <mx:Canvas mouseDown="onMouseDown(event)" mouseUp="onMouseUp(event)" id="graphicsHolder" dropShadowEnabled="true" width="698" height="447" borderStyle="solid" backgroundColor="#FFFFFF" backgroundAlpha="0.5" horizontalCenter="0" top="10" borderColor="#646566"> </mx:Canvas>
</mx:Application>

OUT PUT

Object Handles in Flex

<?xml version="1.0" encoding="utf-8"?>
<mx:Application backgroundColor="#fffffff" creationComplete="update()" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="1251"  xmlns:ns1="*" xmlns:objecthandles="com.roguedevelopment.objecthandles.*" >
<mx:Script>
       <![CDATA[
        
           import flash.events.MouseEvent;
           import mx.events.FlexEvent;
           import flash.geom.*;
           import flash.events.MouseEvent;
           import com.roguedevelopment.objecthandles.ObjectHandles; 
           //var rotateHandle:Class;
           public function update():void 
           {
           var obh:ObjectHandles=new ObjectHandles();
           //var obh2:ObjectHandles=new ObjectHandles();
             var hh:ap=new ap();
             obh.allowHResize=true;
             obh.allowVResize=true;
             //tex.percentHeight=100;
             //tex.percentWidth=100;
             //obh2.width=100;
             //obh2.height=100;
             hh.percentHeight=100;
             hh.percentWidth=100;
             obh.width=100;
             obh.height=100;
             
             cc.addChild(hh);
             cc.addChild(obh);
             //cc.addChild(obh2);
             
             //obh2.addChild(tex);
             obh.addChild(hh);
           }
    
       ]]>
   </mx:Script>


        <mx:Canvas id="cc" x="424" y="123" width="583" height="626" backgroundColor="#ffffff">
        </mx:Canvas>
        <mx:Button click="update()" x="674" y="82" label="Click"/>


</mx:Application>

SCREEN SHOT &  DEMO HERE

Dynamic XML generate in Flex

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  backgroundColor="#ffffff" layout="absolute">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
public var yVal:int=0;
public var syVal:int=0;
public var i:int=0;
private var dataxml:XML;
private var datalist:XML=new XML(<data/>);
private var xxx:XMLList=new XMLList();
    public function add():void
    { 
   
dataxml=new XML(<employee/>);
dataxml.@Sys=tex1.text;
dataxml.@Mb=tex2.text;
dataxml.@Hd=tex3.text;
dataxml.@Ra=tex4.text;
dataxml.@Sm=tex5.text;
dataxml.@Re=tex6.text;
datalist.appendChild(dataxml);
xxx=new XMLList(datalist.children());

data.dataProvider=xxx;
Alert.show("DATAS SEND SUCCESSFULLY");

    }
    public function clr():void
    {
    tex1.text=''
    tex2.text=''
    tex3.text=''
    tex4.text=''
    tex5.text=''
    tex6.text=''
    }
    
    public function search():void
{
if(datalist.employee.length()<1)
{
Alert.show("List Empty");
}
  
for(var j:int=0;j<datalist.employee.length();j++)
{
if(searchT.text==datalist.employee[j].@Sys)
{
//datacomp=new data_comp();
//searchCan.addChild(datacomp);
tex1.text=datalist.employee[j].@Sys;
   tex2.text=datalist.employee[j].@Mb;
tex3.text=datalist.employee[j].@Hd;
         tex4.text=datalist.employee[j].@Ra;
tex5.text=datalist.employee[j].@Sm;
tex6.text=datalist.employee[j].@Re;
//tex1.x=0;
//tex1.y=syVal;
//syVal=syVal+tex1.height;
}

else
{
Alert.show("Nothing Found");
}
    
  }
 
  }
]]>
</mx:Script>






<mx:Iris id="irisOut" duration="1000" showTarget="true"/>
    <mx:Iris id="irisIn" duration="1000" showTarget="false"/>


   <mx:Panel id="pan"  x="426" y="207" width="579" height="446" layout="absolute" horizontalScrollPolicy="auto" includeInLayout="true" paddingBottom="30" borderThickness="5" borderColor="black" cornerRadius="15" backgroundColor="#90877F">
      <mx:Form visible="true" x="69" y="16" height="184" width="410.5" fontWeight="bold">
      <mx:FormItem label="SYSTEM NO" fontWeight="bold" fontSize="12">
      <mx:TextInput id="tex1"/>
      </mx:FormItem>
      <mx:FormItem label="MOTHER BOARD" fontWeight="bold" width="290" fontSize="12">
      <mx:TextInput id="tex2" width="163"/>
      </mx:FormItem>
      
      <mx:FormItem label="HDD" fontWeight="bold" fontSize="12">
      <mx:TextInput id="tex3"/>
      </mx:FormItem>
      <mx:FormItem label="RAM" fontWeight="bold" fontSize="12">
      <mx:TextInput id="tex4"/>
      </mx:FormItem>
      <mx:FormItem label="SMPS" fontWeight="bold" fontSize="12">
      <mx:TextInput id="tex5"/>
      </mx:FormItem>
    
      </mx:Form>
   
      <mx:TextArea id="tex6" fontWeight="bold" color="blue" x="57" y="233" height="118" width="407.5"/>
      <mx:Label x="57" y="202" text="Report" fontWeight="bold" fontSize="14" textDecoration="underline"/>
      <mx:HBox x="89.5" y="368" width="353" height="28">
         <mx:Button id="but1" click="add()" label="Save"/>
         <mx:Button id="but2" click="clr()" label="Clear"/>
         <mx:TextInput id="searchT" width="137"/>
         <mx:Button click="search()" label="Search"/>
      </mx:HBox>
      <mx:DataGrid   id="data"  width="559" height="396" visible="{cb1.selected}"
            showEffect="{irisIn}" hideEffect="{irisOut}" borderStyle="outset"  alpha="1.0" dropShadowColor="black" dropShadowEnabled="true" shadowDirection="right" shadowDistance="5" editable="true" fontWeight="bold" x="0" y="10">
         <mx:columns>
            <mx:DataGridColumn headerText="SYSTEM NO" dataField="@Sys"/>
            <mx:DataGridColumn headerText="MOTHER BOARD" dataField="@Mb"/>
            <mx:DataGridColumn headerText="HDD" dataField="@Hd"/>
            <mx:DataGridColumn headerText="RAM" dataField="@Ra"/>
            <mx:DataGridColumn headerText="SMPS" dataField="@Sm"/>
            <mx:DataGridColumn headerText="REPORT" dataField="@Re"/>
         </mx:columns>
      </mx:DataGrid>
   </mx:Panel>
   <mx:ApplicationControlBar width="579" height="31" cornerRadius="15" fillColors="black" barColor="black" fillAlphas="[0.55, 0.54]" alpha="1.0" color="black" x="426" y="207">
      <mx:CheckBox  id="cb1" label="View Data" selected="false" color="#080808" fontWeight="bold"/>
      <mx:HRule shadowColor="gray" strokeColor="gray" alpha="0.0"/>
      <mx:Label text="COALESCE TECHNOLOGIES" width="229" fontWeight="bold" fontSize="12" color="#0F0FF3"/>
   </mx:ApplicationControlBar>
   


</mx:Application>


SCREEN SHOT &  DEMO HERE