title: Flex: How to resize and move component in runtime?
body: <p>Please, anyone can guide me how to do this stuff.</p>
  
  <p>I have a pannel and a box, The pannel is my component pannel(inside component pannel is eg. image, TextArea, Video) and 
  Box is my target Box for my component creation. The user can select a component he/she want to create (dynamic creation) 
  and drag it to target Box(drag and drop event). Then after creating the component 
  the user can drag the component that he/she created and place anywhere on target 
  Box and also the user can resize the component that he/she created(runtime resize).</p>
  
  <p>i have this code for drag and drop and it seems this code works only on image</p>
  
  <pre><code>//-----action script-----//
          private function dragIt(event:MouseEvent, value: String, objParent: String, objName: String):void 
          {           
              var dragInitiator:Image = event.currentTarget as Image;    
              var dragSource:DragSource = new DragSource();
  
              dragSource.addData(value,'value');
              dragSource.addData(objParent, 'parent');
              dragSource.addData(objName, 'objname'); 
  
              var dragProxy:Image = new Image();
              dragProxy.source = event.currentTarget.source;
  
  
              DragManager.doDrag(dragInitiator, dragSource, event, dragProxy);
          }
  
  
          private function dragEnterHandler(event:DragEvent):void 
          {
              var dropTarget:Box=event.currentTarget as Box;
              dropTarget.setStyle("borderThickness", 5);
              DragManager.acceptDragDrop(dropTarget);
          }
  
          private function dragExitHandler(event:DragEvent):void
          {
              var dropTarget:Box=event.currentTarget as Box;                
              revertBoxBorder();                
          }     
  
          private function revertBoxBorder():void
          {
              targetBox.setStyle("borderThickness", 1);                
          }
  
          private function dragDropHandler(event:DragEvent):void 
          {
              var value:String = event.dragSource.dataForFormat('value') as String;
              var objParent:String = event.dragSource.dataForFormat('parent') as String;
              if(value == "mp3")
              {
               //do something     
              }
              else if (value == "image")
              {
                  if (objParent == "panel")
                  {
                      var imgView: Image = new Image;                 
                      imgView.x = event.stageX;
                      imgView.y = event.stageY;
  
                      addChild(imgView);
                      imgView.name = String(getChildByName(imgView.name).parent.numChildren-1);     
                      imgView.addEventListener(MouseEvent.MOUSE_MOVE,  function(e:MouseEvent):void 
                      {
                      dragIt(e, value, 'box', Image(e.target).name);
                  });
                      imgView.source = ImgInsert;
                  }
                  else
                  {
                      var objName:String = event.dragSource.dataForFormat('objname') as String;
                      getChildByName(objName).parent.getChildAt(int(objName)).x = event.stageX;
                      getChildByName(objName).parent.getChildAt(int(objName)).y = event.stageY;
                  }
  
              }
              else if (value == "textarea")
              {
                  //do something                  
              }
  
          }
  
  //-----mxml code------//
  &lt;mx:Panel x="0" y="37" width="91" height="417" layout="absolute" title="Component" borderColor="#8DA5AB" color="#345860" borderStyle="outset"&gt;
      &lt;mx:Image x="7" y="43" width="21" height="18" source="{TxtAreaInsert}" mouseMove="dragIt(event,'textarea','panel','')"/&gt;
      &lt;mx:Image x="36" y="43" width="21" height="18" source="{ImgInsert}" mouseMove="dragIt(event,'image','panel','')"/&gt;
      &lt;mx:Image x="36" y="80" width="21" height="18" source="{Mp3Insert}" mouseMove="dragIt(event,'mp3','panel','')"/&gt;
      &lt;mx:Image x="7" y="80" width="21" height="18" source="{VdoInsert}" mouseMove="dragIt(event,'video','panel','')"/&gt;
  &lt;/mx:Panel&gt;
  &lt;mx:Box id="targetBox" y="37" width="589" height="417" borderColor="#8CC2E8" backgroundColor="#D5DBEE"
      dragExit="dragExitHandler(event)" dragEnter="dragEnterHandler(event)" dragDrop="dragDropHandler(event)" left="99"&gt;
  &lt;/mx:Box&gt;;
  </code></pre>
  
  <p>How to move thus non image component like TxtArea? How to resize the component inside target box?
  (This is like GUI of flex when creating component)
  Thank you..</p>