簡單的虛線Components

這是一個簡單的虛線元件，還未做記憶體管理效率化以及點的大小動態更改處理。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:view="ut.view.*">
 <s:VGroup width="100%" paddingTop="5" paddingLeft="5" paddingRight="5">
  <view:DottedLine width="100%" dotteLineMode="line" color="0x0000FF"/>
  <view:DottedLine width="100%" dotteLineMode="dot" color="0x0000FF"/>
  <view:DottedLine width="100" dotteLineMode="line" color="0xFF0000"/>
  <view:DottedLine width="100" dotteLineMode="dot" color="0xFF0000"/> 
 
  <s:HGroup>
   <view:DottedLine width="100" dotteLineMode="dot" color="0xFF0000" rotation="90"/>
   <view:DottedLine width="100" dotteLineMode="line" color="0xFF0000" rotation="90"/>
   <view:DottedLine width="100" dotteLineMode="line" color="0xFF0000" rotation="90"/>
   <view:DottedLine width="100"  dotteLineMode="dot" color="0xFF0000" rotation="90"/>
  </s:HGroup>
 </s:VGroup>
</s:Application>

package ut.view
{
 import flash.display.Bitmap;
 import flash.display.BitmapData;
 import flash.display.DisplayObject;
 import flash.display.Graphics;
 import flash.display.Shape;
 import flash.utils.getTimer;
 
 import mx.graphics.BitmapFillMode;
 
 import spark.primitives.BitmapImage;
 
 import ut.enum.DottedLineMode;
 
 public class DottedLine extends BitmapImage
 {  
  public function DottedLine(color:uint = 0xD4D4D4 , dotteLineMode:String=DottedLineMode.DOT)
  {  
   this.color = color
   this.dotteLineMode = dotteLineMode;
    
  }  
    
  private var _color:uint;
  /**虛線的顏色*/
  public function get color():uint
  {
   return _color;
  }
  public function set color(value:uint):void
  { 
   if(_color != value)
   {
    _color = value;
    changeSource();
   }
  }
  
  
  private var _dotteLineMode:String;
  /**選則點或線的虛線，可由DottedLineMode選擇輸入參數*/ 
  [Inspectable(category="General", enumeration="dot,line", defaultValue="stretch")]
  public function get dotteLineMode():String 
  {
   return  _dotteLineMode;
  }  
  public function set dotteLineMode(dottedLineMode:String):void
  {  
   if(dottedLineMode == DottedLineMode.DOT || dottedLineMode == DottedLineMode.LINE)
   {  
    if(_dotteLineMode != dottedLineMode)
    {
     _dotteLineMode = dottedLineMode; 
     changeSource();
    }
   }
  }  
 
  
  /**bitmapImage所要填入source*/
  private function changeSource():void
  {
   switch(dotteLineMode)
   {
    case DottedLineMode.DOT:
     setSource(createDotDotted);
     break;
    case DottedLineMode.LINE:
     setSource(createLineDotteed);
     break;
    default:
     
   }
  }
  
  /**預設為點狀態的虛線*/
  private function setSource(createMethod:Function):void
  { 
   this.source = null;
   this.source = getBitmap(createMethod(color));
   this.fillMode = BitmapFillMode.REPEAT;
  }  
  
 
  /**將畫好的圖轉換成bitmap  (displayObject to bitmap)*/
  private function getBitmap(target:DisplayObject):Bitmap
  {
   var _bitMapData:BitmapData = new BitmapData(target.width , target.height , true  , 0x000000);
    _bitMapData.draw(target);   
   var _bitMap:Bitmap = new Bitmap(_bitMapData);
   return _bitMap;   
  }
  
  
  /**畫兩個圓依照color,其中一個是看不見,如此bitmap在repeat時方有間隔*/
  protected function createDotDotted(color:uint=0xD4D4D4 ,  ellipseX:Number=0 , ellipseY:Number=0 , ellipseWidth:Number=2 , ellipseHeight:Number=2):DisplayObject
  {   
   var grapgics:Shape = new Shape();
    //first ellipse alpha is 1
    grapgics.graphics.beginFill(color);
    grapgics.graphics.drawEllipse(ellipseX , ellipseY , ellipseWidth , ellipseHeight);     
    //second ellipse alpha is 0 
    grapgics.graphics.beginFill(0xFFFFFF , 0);
    grapgics.graphics.drawEllipse(ellipseX+ellipseWidth , ellipseY , ellipseWidth , ellipseHeight);
    //end fill
    grapgics.graphics.endFill();
   return grapgics;
  }
  
  /**畫兩個線段*/
  protected function createLineDotteed(color:uint=0xD4D4D4 ,  rectX:Number=0 , rectY:Number=0 , rectWidth:Number=3 , rectHeight:Number=1):DisplayObject
  {
   var grapgics:Shape = new Shape();
   //first line
   grapgics.graphics.beginFill(color);
   grapgics.graphics.drawRect(rectX , rectY , rectWidth , rectHeight);   
   //second line
   grapgics.graphics.beginFill(0xFFFFFF , 0);
   grapgics.graphics.drawRect( rectX + rectWidth , rectY , rectWidth , rectHeight);
   //end fill 
   grapgics.graphics.endFill();
   return grapgics; 
  }
 }
}

package ut.enum
{
 public class DottedLineMode
 {
  static public const DOT:String =  "dot";
  static public const LINE:String = "line";
  public function DottedLineMode()
  {
  }
 }
}