个人博客:狼之梦---爱乌及屋
今天项目需要,需要画虚线,后面看到一下API,AS中没有相关的API所以要自己实现,后面在网上查了一下相关资料,整了用鼠标可以画虚线的东东。
Flex中的代码(作表现用):
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:line="cyou.line.*" initialize="init()" > <mx:Script> <![CDATA[ import cyou.line.DrawLine; private var isDrawing:Boolean=false; private var startP:Point=new Point(); private function drawLine(event:MouseEvent):void{ if(!isDrawing){ //第一次click开始记录开始点,开始画线 startP.x=event.localX; startP.y=event.localY; isDrawing=true; }else{ isDrawing=false; } } private function moveMouse(event:MouseEvent):void{ if(isDrawing){ panel.graphics.clear(); var endP:Point=new Point(event.localX,event.localY); var dl:DrawLine=new DrawLine(); dl.freeDraw(startP,endP,panel.graphics); } } ]]> </mx:Script> <mx:VBox width="100%" height="100%" id="panel" click="drawLine(event)" mouseMove="moveMouse(event)"/> </mx:Application>
下面是核心代码(AS):
package cyou.line
{
import flash.display.Graphics;
import flash.geom.Point;
public class DrawLine
{
public function DrawLine()
{
}
public function freeDraw(fP:Point,tP:Point,g:Graphics):void {
g.lineStyle(5,0x000000,1);
if(!fP){
fP=new Point(0,0);
}
if(!tP){
tP=new Point(0,0);
}
var solidLength:Number=10;
var brokenLength:Number=10;
var lineAngle:Number;
lineAngle = Math.atan2(tP.y - fP.y,tP.x - fP.x);
var xSolidLength:Number=solidLength*Math.cos(lineAngle);
var ySolidLength:Number=solidLength*Math.sin(lineAngle);
var xBrokenLength:Number=brokenLength*Math.cos(lineAngle);
var yBrokenLength:Number=brokenLength*Math.sin(lineAngle);
var forwardFlag:Boolean=true;
if(tP.x<fP.x){
forwardFlag=false;
}
var tempP:Point=new Point(fP.x,fP.y);
var tempToP:Point=new Point(tP.x,tP.y);
//当线是实线的时候
var lineType:String="solid";
while(checkIn(tempP.x,tP.x,forwardFlag)){
g.beginFill(0x555555);
if(lineType=="solid"){
tempToP.x=tempP.x+xSolidLength;
tempToP.y=tempP.y+ySolidLength;
g.moveTo(tempP.x, tempP.y);
g.lineTo(tempToP.x, tempToP.y);
lineType="space";
}else{
tempToP.x=tempP.x+xBrokenLength;
tempToP.y=tempP.y+yBrokenLength;
g.moveTo(tempToP.x, tempToP.y);
lineType="solid";
}
tempP.x=tempToP.x;
tempP.y=tempToP.y;
g.endFill();
}
}
private function checkIn(x:Number,toX:Number,forwardFlag:Boolean):Boolean{
var result:Boolean=true;
if(forwardFlag){//向前
if(x<toX){
}else{
result=false;
}
}else{
if(x>toX){
}else{
result=false;
}
}
return result;
}
}
}
其实画虚线就是一个先画一条短信,然后沿着终点向移动一段空白矩离,再接着画实线,一直这样重复,直到画到终点为止。
其效果如下: