由于项目需要，实现画线功能，在网上找了些例子，效果都不满意，所以就自己动手简单写了一个测试的demo。

其实比较简单，下面来看看主要的代码吧。

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
  xmlns:s="library://ns.adobe.com/flex/spark" title="DTLine">

 <fx:Script>
  <![CDATA[
  import mx.controls.*;
  import mx.core.*;
  
  import spark.effects.*;
  import spark.effects.Fade;
  import spark.effects.Move;
  public var lines :Sprite =  new Sprite ();
  public var lines1 :flash.display.Sprite =  new Sprite ();
  
  public var count:int;
  
  public function TestPaint():void
  {
      lines.graphics.lineStyle(2,0x0099ff,1);
      DrawLine(lines,lbl,btn1);
      DrawLine(lines,lbl,btn2);
      DrawLine(lines,lbl,btn3);
  
      count=0;
      addEventListener(MouseEvent.MOUSE_DOWN,mouseDown);
     
  }
  
  public function mouseDown(event:MouseEvent):void
  {   
  
      lines.graphics.moveTo( event.localX,event.localY);
  
  }
  
  public function mouseUp(event:MouseEvent):void
  {   
   var comp: UIComponent = new UIComponent();
      lines.graphics.lineTo(event.localX,event.localY);
      comp.addChild(lines);
      this.addElement(comp);
  }
  public function DrawLine(lines:Sprite,uFrom:UIComponent,uTo:UIComponent):void
  {
      lines.graphics.moveTo(uFrom.x+uFrom.width/2,uFrom.y+uFrom.height/2);
      lines.graphics.lineTo(uTo.x+uTo.width/2,uTo.y+uTo.height/2);
  }
  
  
  public function btn1_mouseOver(event:Event):void
  {
      lines1.graphics.lineStyle(2,0xd43dd6,1);
      DrawLine(lines1,btn1,btn2);
      DrawLine(lines1,btn1,lbl);
      var comp: UIComponent = new UIComponent();
      comp.addChild(lines1);
      this.addElement(comp);
  }
  public function btn1_mouseOut(event:Event):void
  {
      lines1.graphics.clear();
      DrawLine(lines,lbl,btn1);
  }
  
  
  public function Testmove():void
  {
      var move:Move = new Move();
      if(btn2.x!=lbl.x)
      {
          move.target=btn2;
          move.end();
          move.xTo=lbl.x;
          move.yTo=lbl.y;
          move.play();
      }
     else
      {
          move.target=btn2;
          move.end();
          move.xTo=340;
          move.yTo=104;
          move.play();
      }
   }
   public function moveprint():void
   {
    addEventListener(MouseEvent.MOUSE_DOWN,mouseDown1);
    addEventListener(MouseEvent.MOUSE_UP,mouseUp1);
   
   }
   
   public function mouseDown1(event:MouseEvent):void
   {   
    lines.graphics.lineStyle(2,0x0099ff,1);
    
    lines.graphics.moveTo(event.localX,event.localY);
    addEventListener(MouseEvent.MOUSE_MOVE,mouseMove);
    
    textArea.text="x:"+event.localX.toString()+"Y:"+event.localY.toString();
   }
   
   public function mouseUp1(event:MouseEvent):void
   {   
    this.removeEventListener(MouseEvent.MOUSE_MOVE,mouseMove);
    lines.graphics.clear();
   }
   
  public function mouseMove(event:MouseEvent):void
  {
   var comp: UIComponent = new UIComponent();
   lines.graphics.lineTo(event.localX,event.localY);
   comp.addChild(lines);
   this.addElement(comp);
   
   textArea.text+="\r"+"x:"+event.localX.toString()+",Y:"+event.localY.toString();
   
   fade.target=comp;
   fade.end();
   fade.play();
  }
   
  private function txtMouseOver(event:MouseEvent):void
  {
   txt2.text+="\r"+"Over_X:"+event.localX.toString()+",Over_Y:"+event.localY.toString();
  }
  private function txtMouseOut(event:MouseEvent):void
  {
   txt2.text+="\r"+"Out_X:"+event.localX.toString()+",Out_Y:"+event.localY.toString();
  }
   
  ]]>
 </fx:Script>
 
 <fx:Declarations>
  <!-- 将非可视元素（例如服务、值对象）放在此处 -->
  <s:Fade id="fade" alphaFrom="1" alphaTo="0" duration="500"/>
 </fx:Declarations>

 <s:Button x="176" y="34" label="btn1" id="btn1" mouseOver="btn1_mouseOver(event)" mouseOut="btn1_mouseOut(event)"/>
 <s:Button x="340" y="104" label="btn4" id="btn2"/>
 <s:Button x="53" y="167" label="btn3" id="btn3"/>
 <s:Button x="131" y="373" label="Paint" click="TestPaint()"/>
 <s:Label x="176" y="169" text="LblMiddle" width="71" height="20" id="lbl"/>
 <s:Button x="303" y="324" label="Move" click="Testmove()"/>
 <s:Button x="132" y="466" label="MovePaint" click="moveprint()"/>
 <s:TextArea x="328" y="426" width="318" height="222" id="textArea" mouseOver="txtMouseOver(event)" mouseOut="txtMouseOut(event)"/>
 <s:TextArea x="682" y="426" height="223" id="txt2"/>

</s:View>