用flashAS3.0做一个连线题

来源：互联网发布：淘宝哪家店女装好看编辑：程序博客网时间：2024/05/15 19:37

AS3.0做连线题

博主最近在做一个数学题的项目，根据要求做一些简单的动画或者藏蓄实现其功能。第一次接触项目，感觉很兴奋，正好可以练练手。其中，有一个连线的题目，之前一直没有遇到过，感觉蛮复杂的，现在分享一下如何实现的吧。

实现的功能：点击选项---出现红线且跟随鼠标移动---只有到正确答案面前才能落下，且有正确铃声。若是错误答案不落下且有错误铃声---有重新连线和正确答案功能

代码如下：

import flash.media.Sound;var i:int;var p1 = new Point;//记录划线开始点var p2 = new Point;//记录划线结束点var cricleEnd:Shape = new Shape;//用于画点var c_size:int = 3;//点的半径var stopLine:Shape = new Shape;//用于跟随画线var newLine:Shape = new Shape;//用于直接画线var last_qus: int;//用于判断答案是否正确 var sound: Sound;//用于播放音效start_btn.addEventListener(MouseEvent.CLICK, start_line);//开始连线replay_btn.addEventListener(MouseEvent.CLICK, replay_line);//重新连线ans_btn.addEventListener(MouseEvent.CLICK, show_ans);//重新连线function start_line(e){replay_line(Event)//清除连线//点击问题for (i=1; i<=4; i++){this["mc" + i].buttonMode = true;this["mc" + i].addEventListener(MouseEvent.CLICK, draw_point);}//点击答案for (i=1; i<=4; i++){this["ans" + i].buttonMode = true;this["ans" + i].addEventListener(MouseEvent.CLICK, stop_line);}}//画点function draw_point(e){last_qus = e.currentTarget.name.charAt(e.currentTarget.name.length - 1);p1.x = e.currentTarget.x;p1.y = e.currentTarget.y;var c_size:int = 3;cricleEnd.graphics.beginFill(0xFF3300,1);cricleEnd.graphics.drawCircle(p1.x, p1.y, c_size);cricleEnd.graphics.endFill();this.addChild(cricleEnd);//点击完之后移除点击事件和手型this["mc" + last_qus].buttonMode = false;this["mc" + last_qus].removeEventListener(MouseEvent.CLICK, draw_point);//加上鼠标跟随的监听stage.addEventListener(MouseEvent.MOUSE_MOVE,draw_line);}function draw_line(e){stopLine.graphics.clear();stopLine.graphics.lineStyle(3,0xFF3300,1);stopLine.graphics.moveTo(p1.x, p1.y);stopLine.graphics.lineTo(mouseX,mouseY);this.addChild(stopLine);}function stop_line(e){var a: int= e.currentTarget.name.charAt(e.currentTarget.name.length - 1);if ( last_qus !=  a)//选择错误{sound = new wrong_sound();sound.play();}else{//选择正确sound = new right_sound();sound.play();stage.removeEventListener(MouseEvent.MOUSE_MOVE,draw_line);p2.x = e.currentTarget.x-10;p2.y = e.currentTarget.y;cricleEnd.graphics.beginFill(0xFF3300,1);cricleEnd.graphics.drawCircle(p2.x, p2.y, c_size);cricleEnd.graphics.endFill();this.addChild(cricleEnd);//划线stopLine.graphics.clear();newLine.graphics.lineStyle(3,0xFF3300,1);//颜色和粗细newLine.graphics.moveTo(p1.x, p1.y);//起点newLine.graphics.lineTo(p2.x, p2.y);//终点this.addChild(newLine);//显示//移除事件this["ans" + a].buttonMode = false;this["ans" + a].removeEventListener(MouseEvent.CLICK, stop_line);}}

大多采用鼠标侦听事件，重新连线和正确答案的代码如下：

//清除连线function replay_line(e){newLine.graphics.clear();//清除线cricleEnd.graphics.clear();//清除点}//显示答案function show_ans(e){replay_line(Event);//画点cricleEnd.graphics.beginFill(0xFC0000,1);cricleEnd.graphics.drawCircle(mc1.x, mc1.y, c_size);cricleEnd.graphics.drawCircle(mc2.x, mc2.y, c_size);cricleEnd.graphics.drawCircle(mc3.x, mc3.y, c_size);cricleEnd.graphics.drawCircle(mc4.x, mc4.y, c_size);cricleEnd.graphics.drawCircle(ans1.x-10, ans1.y, c_size);cricleEnd.graphics.drawCircle(ans2.x-10, ans2.y, c_size);cricleEnd.graphics.drawCircle(ans3.x-10, ans3.y, c_size);cricleEnd.graphics.drawCircle(ans4.x-10, ans4.y, c_size);cricleEnd.graphics.endFill();this.addChild(cricleEnd);//划线newLine.graphics.lineStyle(3,0xFC0000,1);newLine.graphics.moveTo(mc1.x, mc1.y);newLine.graphics.lineTo(ans1.x-10, ans1.y);newLine.graphics.moveTo(mc2.x, mc2.y);newLine.graphics.lineTo(ans2.x-10, ans2.y);newLine.graphics.moveTo(mc3.x, mc3.y);newLine.graphics.lineTo(ans3.x-10, ans3.y);newLine.graphics.moveTo(mc4.x, mc4.y);newLine.graphics.lineTo(ans4.x-10, ans4.y);this.addChild(newLine);}

希望该博客能对你有所帮助，也可以留言提问。。。

0 0