Flex画线动画一例

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
				layout="absolute"
				width="717"
				height="554"
				backgroundGradientAlphas="[1.0, 1.0]"
				backgroundGradientColors="[#FFFFFF, #FFFFFF]"
				verticalAlign="middle"
				creationComplete="init();">
	<mx:Canvas x="301"
			   y="78"
			   width="300"
			   height="250"
			   id="pop"
			   creationComplete="drawBorder();">
	</mx:Canvas>

	<mx:Script>
		<![CDATA[
			import mx.rpc.events.FaultEvent;
			import mx.rpc.events.ResultEvent;
			import mx.controls.Alert;

			private var timer1:Timer=new Timer(20);
			private var timer2:Timer=new Timer(20);
			private var timer3:Timer=new Timer(20);
			private var timer4:Timer=new Timer(20);
			private var timer5:Timer=new Timer(20);
			private var timer6:Timer=new Timer(20);

			private var line1X:Number=150;
			private var line1Y:Number=250;

			private function init():void
			{
				timer1.addEventListener(TimerEvent.TIMER, drawLine1);
				timer2.addEventListener(TimerEvent.TIMER, drawLine2);
				timer3.addEventListener(TimerEvent.TIMER, drawLine3);
				timer4.addEventListener(TimerEvent.TIMER, drawLine4);
				timer5.addEventListener(TimerEvent.TIMER, drawLine5);
				timer6.addEventListener(TimerEvent.TIMER, drawLine6);
			}

			private function drawLine1(e:TimerEvent):void
			{
				var _lineToX:Number=line1X + 6;
				var _lineToY:Number=line1Y - 12;
				pop.graphics.moveTo(line1X, line1Y);
				pop.graphics.lineTo(_lineToX, _lineToY);
				line1X=_lineToX;
				line1Y=_lineToY;
				if (line1X >= 180)
				{
					timer1.stop();
					timer2.start();
				}
			}

			private function drawLine2(e:TimerEvent):void
			{
				var _lineToX:Number=line1X + 22;
				pop.graphics.moveTo(line1X, line1Y);
				pop.graphics.lineTo(_lineToX, line1Y);
				line1X=_lineToX;
				if (line1X >= 290)
				{
					timer2.stop();
					timer3.start();
				}
			}

			private function drawLine3(e:TimerEvent):void
			{
				var _lineToY:Number=line1Y - 20;
				pop.graphics.moveTo(line1X, line1Y);
				pop.graphics.lineTo(line1X, _lineToY);
				line1Y=_lineToY;
				if (line1Y <= 10)
				{
					timer3.stop();
					timer4.start();
				}
			}

			private function drawLine4(e:TimerEvent):void
			{
				var _lineToX:Number=line1X - 20;
				pop.graphics.moveTo(line1X, line1Y);
				pop.graphics.lineTo(_lineToX, line1Y);
				line1X=_lineToX;
				if (line1X <= 10)
				{
					timer4.stop();
					timer5.start();
				}
			}

			private function drawLine5(e:TimerEvent):void
			{
				var _lineToY:Number=line1Y + 20;
				pop.graphics.moveTo(line1X, line1Y);
				pop.graphics.lineTo(line1X, _lineToY);
				line1Y=_lineToY;
				if (line1Y >= 190)
				{
					timer5.stop();
					timer6.start();
				}
			}

			private function drawLine6(e:TimerEvent):void
			{
				var _lineToX:Number=line1X + 13;
				pop.graphics.moveTo(line1X, line1Y);
				pop.graphics.lineTo(_lineToX, line1Y);
				line1X=_lineToX;
				if (line1X >= 140)
				{
					timer6.stop();
				}
			}

			public function drawBorder():void
			{
				pop.graphics.lineStyle(2, 0xFF00FF, 1);
				pop.graphics.moveTo(150, 250);
				timer1.start();
//				pop.graphics.lineTo(180, 190);
//				pop.graphics.moveTo(180, 190);
//				pop.graphics.lineTo(290, 190);
//				pop.graphics.moveTo(290, 190);
//				pop.graphics.lineTo(290, 10);
//				pop.graphics.moveTo(290, 10);
//				pop.graphics.lineTo(10, 10);
//				pop.graphics.moveTo(10, 10);
//				pop.graphics.lineTo(10, 190);
//				pop.graphics.moveTo(10, 190);
//				pop.graphics.lineTo(140, 190);
			}
		]]>
	</mx:Script>

</mx:Application>

评论

2 楼 fangfangzh 2010-07-22  

学习啦 谢谢分享 期待更好的文章。 

1 楼 brightACE 2010-03-01  

感谢分享，现在画线的例子比较多，画点的函数比较少啊