连线题是一种常见的测试题型,利用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 ,moveFun);
        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=e.target.name.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 ,moveFun);
        myshape.graphics.moveTo(this["f"+j].x,this["f"+j].y);
        myshape.graphics.lineTo(mouseX,mouseY);
        zhengque.play();//并且播放答案正确的声音
    }
    else{//否则
        cuowu.play();//播放答案错误的声音
    }
}
...
 

源文件案例下载单击下载     更多案例请参见flash课件制作精粹