FLASH制作连线题详解

FLASH制作连线题详解-以AS3为例

时间:2013-09-17 11:20来源:电脑教程学习网编辑:xiaolian

连线题是一种常见的测试题型，利用FLASH中的画线功能可以很容易实现“连线”的过程，但对连线结果的判断却有一定的难度，在这里为大家介绍两种实现连线结果的判断方法。

连线题设计方法：

1，利用graphics实现画线的过程，通常操作过程为鼠标按下开始画线，鼠标移动是画线的过程，鼠标弹起结束画线：

addEventListener(MouseEvent.MOUSE_DOWN,mc1Down);

function mc1Down(e:MouseEvent ):void{

stage.addEventListener(MouseEvent.MOUSE_MOVE ,moveFun);

stage.addEventListener(MouseEvent.MOUSE_UP ,upFun);

}

function moveFun(e:MouseEvent ):void{

graphics.clear();

graphics.lineStyle(3,0xff0000);

graphics.moveTo(xx,yy);

graphics.lineTo(mouseX,mouseY);

}

function upFun(e:MouseEvent ):void{

stage.removeEventListener(MouseEvent.MOUSE_MOVE ,moveFu n);

stage.removeEventListener(MouseEvent.MOUSE_UP ,upFun);

}

2，实现连线结果判断：通过单击指定按钮判断。

因为如果依据鼠标移动位置来判断连线对象，难度比较大。通常可以在接近连线目标区时单击指定的对象（如按钮，通过这个单击事件实现答案判断和信息反馈），下面看示例：

这个连线的过程在于单击题干中的按钮确定连线的起点，移动鼠标显示连线的方向和过程，单击答案中的按钮确定目标是否正确。（这里是只有正确的情况才可以连线，实现可以做成不问正确与否都可连线，但最后显示评分信息）

连线题实现过程：

1，根据连线需要制作相应的界面，这里必须为每一个连线选项设计一组按钮，

一个用来确定连线起始位置，一个用来判断连线结果和结事位置，如图：

这个连线题有5对，相应的就要有5组按钮，它们实例名分别为：f1、f2、f3、f4、f5和f1f、f2f、f3f、f4f、f5f。注意这里的按钮并不是按顺序排列的，而是根据答案来确定顺序的，比如第一个是图标灯泡对应的按钮为f1,连线正确的答案项是下排第2个，所以灯泡上方的按钮按钮是f1f。（如果按序排列，则在判断答案时则要根据实际值判断，大家可以试着更改一下）

2，创建两个容器，用来实现实现过程，一个是用来临时显示画线过程（如果不这样做，则在实现后一个连线过程时前一个连线就被自动清除了）

//创建一个名字为myshape的Shape对象，用来显示连线

var myshape:Shape=new Shape();

myshape.graphics.lineStyle(3,0xff0000);

addChild(myshape);

//这个容器用来临时显示画线过程，以避免画线过程中clear()方法清空上次画线的轨迹。

var tempShape = new Shape();

myshape.graphics.lineStyle(3,0xff0000);

addChild(tempShape);

3，定义反馈答案方式，在这里以声音提供连线结果。

//定义一个变量j，变量j用来取得单击起始位置中的数值，作为答案判断的依据，如单击f2,则j=2,在判断答案时其就是判断的条件。

var j;

//zSound是通过库中的链接命令创建的一个flash.media.Sound类的子类，

//这里通过这个子类定义一个名字叫zhengque的声音对象，用来提供连线正确时的反馈信息

var zhengque:zSound=new zSound();

//cSound是通过库中的链接命令创建的一个flash.media.Sound类的子类，

//这里通过这个子类定义一个名字叫cuowu的声音对象，用来提供连线错误时的声音反馈

var cuowu:cSound=new cSound();

4，定义连线开始操作过程和画线实现

//将上面的5个按钮注册MouseEvent.CLICK事件到侦听函数fH

f1.addEventListener(MouseEvent.CLICK,fH);

f2.addEventListener(MouseEvent.CLICK,fH);

f3.addEventListener(MouseEvent.CLICK,fH);

f4.addEventListener(MouseEvent.CLICK,fH);

f5.addEventListener(MouseEvent.CLICK,fH);

//定义fH函数

function fH(e:MouseEvent):void {

//获得所单击按钮的名称字符串的第2个字符，并将其赋值给变量j

j=.charAt(1);

//确定绘图的初始点，设置为所单击按钮的坐标

stage.addEventListener(MouseEvent.MOUSE_MOVE ,moveFun);

//stage.addEventListener(MouseEvent.MOUSE_UP ,upFun);

}

function moveFun(e:MouseEvent ):void

{

tempShape.graphics.clear();

tempShape.graphics.lineStyle(3,0xff0000);

tempShape.graphics.moveTo(this["f"+j].x,this["f"+j].y);

tempShape.graphics.lineTo(mouseX,mouseY);

}

5，完成画线和答案判断

//将下面面的5个按钮注册MouseEvent.CLICK事件到侦听函数fH2

f1f.addEventListener(MouseEvent.CLICK,f1H);

f2f.addEventListener(MouseEvent.CLICK,f2H);

f3f.addEventListener(MouseEvent.CLICK,f3H);

f4f.addEventListener(MouseEvent.CLICK,f4H);

f5f.addEventListener(MouseEvent.CLICK,f5H);

//定义f1H函数

function f1H(e:MouseEvent):void {

if (j==1) {//如果连线匹配，停止画线，并显示所画的线

stage.removeEventListener(MouseEvent.MOUSE_MOVE ,moveFu n);

myshape.graphics.moveTo(this["f"+j].x,this["f"+j].y);

myshape.graphics.lineTo(mouseX,mouseY);

zhengque.play();//并且播放答案正确的声音

}

else{//否则

cuowu.play();//播放答案错误的声音