程晓-运用Flash中UI组件制作填空题课件.doc

题目：运用Flash中UI组件制作填空题课件

作者：程晓

单位：昌平区职工学校运用Flash中UI组件制作填空题课件
摘要：使用Flash制作填空题，本文尝试了一种使用脚本编程，按钮和动态文本制作填空题的方法，并对结果统计，计算得分。
关键词：填空题 Flash 脚本编程 纵横码 UI组件
填空题是标准测验课件最主要的题型之一，它的使用范围最广。这种课件充分利用了计算机的交互性、多媒体和智能性，使教育过程中的练习和测验活动变得更加简洁有效。使用Flash中的脚本编程、按钮元件和动态文本来实现制作填空题，在制作过程中充分运用UI(User Interface)组件，这种方法便于课件界面的设计和信息的收集，更能实现计算机与使用者之间的交互，下面以纵横码填空题课件的制作为例来说明其制作过程
一、 课件介绍
首先介绍一下课件，课件的界面如图1所示，使用时，用户在横线上填写正确的纵横码编码，共十道填空题，每题十分。在所有题目做完并且检查无误后，点击提交按钮。交卷后，课件会根据用户填写的内容做出判断，在正确的题目后显示“√”，在错误的题目后面显示“ⅹ”，点击答案按钮可显示正确的答案。在右上角成绩统计区域呈现总得分。（如图1所示）

图1
二、 制作过程
1.制作元件
课件中用到的影片剪辑元件有“正误判断”，用于提示用户填写的正误。按钮元件有“提交” “重做”“答案”“返回”，用于用户的选择。
（1）新建Flash文档。首先从“文件”菜单里单击“新建”命令，新建一个Flash文档，然后把图层1重命名为“背景”，接着在背景图层的第一帧导入一幅自己满意的图片做背景,在第二帧处按F5键把图层延长到第二帧。
（2）制作“正误判断”元件，按下Ctrl＋F8键,在创建新元件对话框中输入名称“正误判断”，类型选择影片剪辑，（如图2所示）。为第一帧添加脚本“stop()”,选择第2、3帧按下F7键插入空白关键帧。在第2帧的舞台中央插入一个红色的对号，在第3帧的舞台中央插入一个红色的错号。

图2
（3）创建“提交”元件，类型设置为按钮，在“指针经过”帧插入空白关键帧，绘制空心矩形，把矩形对齐到舞台的中央，在“点击”帧插入关键帧，并为矩形填充颜色。在按钮上方插入文字“提交”。依照此方法，分别制作 “重做”“答案”“返回”按钮。
2.设置界面
（1）设置题目区域
①新建图层，重命名为“题目”，在第1帧的舞台中央设置10道填空题。按Ctrl+F7插入输入文本，找到User Interface ,（如图3所示）将输入文本组件拖放到填空题的空白处，在输入文本的属性面板中将其改名为“t1_txt”，依照此方法，分别制作其它9道填空题，第10题改名为“t10_txt”。在屏幕的右上角，再拖放一个输入文本，用于显示总成绩，将这个实例改名为“cj_txt”。

图3
②打开库面板，将新建好的“正误判断”影片剪辑拖放到第一题的后面，形成一个实例，用于显示对错，将此实例改名为“pd1_mc”。分别拖放“正误判断”影片剪辑到其它的题后面，并分别为实例改名，第10题改名为“pd10_mc”。
③新建图层，重命名为“按钮”， 在第1帧处，打开库面板，将“提交”按钮拖放到舞台下方，在属性面板中将其重命名为“tj_btn”。在第2帧处，打开库面板，将“重做” “答案”按钮拖放到舞台下方，并分别重命名为“fh_btn”“ da_btn”。
④插入场景，自动命名为“场景2”， 为第1帧添加脚本“stop()”，在第1帧的舞台中央将填空题的原题和正确答案显示出来，将“返回”按钮拖放在舞台的右上角。（如图4所示）

图4
3.添加动作脚本代码
(1)回到场景1，新建图层并重命名为“动作”。为第1帧添加代码，如下：
stop();
t1_txt.text = "";//设置第1题初始值为空字符串
t2_txt.text = "";
t3_txt.text = "";
t4_txt.text = "";
t5_txt.text = "";
t6_txt.text = "";
t7_txt.text = "";
t8_txt.text = "";
t9_txt.text = "";
t10_txt.text = "";
cj_txt.text = "";
cj1 = 0;//设置第1题的成绩初始值为0分
cj2 = 0;
cj3 = 0;
cj4 = 0;
cj5 = 0;
cj6 = 0;
cj7 = 0;
cj8 = 0;
cj9 = 0;
cj10 = 0;
var t1:String = "";设置变量t1为空字符串
var t2:String = "";
var t3:String = "";
var t4:String = "";
var t5:String = "";
var t6:String = "";
var t7:String = "";
var t8:String = "";
var t9:String = "";
var t10:String = "";
tj_btn.onRelease = function() {
gotoAndStop(2);//点击提交按钮，跳转到第2帧
};
da_btn.onRelease = function() {
gotoAndPlay("场景 2", 1);//点击答案按钮，跳转到场景2的第1帧
};
(2)为第2帧添加代码，如下：
if (((t1_txt.text == "0829"))) {
pd1_mc.gotoAndStop(2);//如果第1题输入的答案是0829，跳转到第2帧，成绩为1分
cj1 = 1;
} else {
pd1_mc.gotoAndStop(3); //如果第1题输入的答案不是0829，跳转到第3帧，成绩为0分
cj1 = 0;
}
if (((t2_txt.text == "3076"))) {
pd2_mc.gotoAndStop(2);
cj2 = 1;
} else {
pd2_mc.gotoAndStop(3);
cj2 = 0;
}
if (((t3_txt.text == "4541"))) {
pd3_mc.gotoAndStop(2);
cj3 = 1;
} else {
pd3_mc.gotoAndStop(3);
cj3 = 0;
}
if (((t4_txt.text == "308"))) {
pd4_mc.gotoAndStop(2);
cj4 = 1;
} else {
pd4_mc.gotoAndStop(3);
cj4 = 0;
}
if (((t5_txt.text == "357"))) {
pd5_mc.gotoAndStop(2);
cj5 = 1;
} else {
pd5_mc.gotoAndStop(3);
cj5 = 0;
}
if (((t6_txt.text == "941"))) {
pd6_mc.gotoAndStop(2);
cj6 = 1;
} else {
pd6_mc.gotoAndStop(3);
cj6 = 0;
}
if (((t7_txt.text == "120"))) {
pd7_mc.gotoAndStop(2);
cj7 = 1;
} else {
pd7_mc.gotoAndStop(3);
cj7 = 0;
}
if (((t8_txt.text == "81"))) {
pd8_mc.gotoAndStop(2);
cj8 = 1;
} else {
pd8_mc.gotoAndStop(3);
cj8 = 0;
}
if (((t9_txt.text == "02"))) {
pd9_mc.gotoAndStop(2);
cj9 = 1;
} else {
pd9_mc.gotoAndStop(3);
cj9 = 0;
}
if (((t10_txt.text == "9"))) {
pd10_mc.gotoAndStop(2);
cj10 = 1;
} else {
pd10_mc.gotoAndStop(3);
cj10 = 0;
}
cj_txt.text = (cj1+cj2+cj3+cj4+cj5+cj6+cj7+cj8+cj9+cj10)*10;//设置成绩框中的总成绩为第1题到第10题的成绩之和乘以10
fh_btn.onRelease = function() {
gotoAndPlay(1);//点击返回按钮，回到第1帧
}
da_btn.onRelease = function() {
gotoAndPlay("场景 2", 1);// 点击答案按钮，跳转到场景2的第1帧
};
三、 打包发布
课件制作完成后，按下Ctrl+Enter键进行测试，在课件正常运行后要对课件进行打包发布，方便课件在其它的环境下也能运行，使其具有可移植性。
选择文件菜单下的发布设置选项，在打开的设置面板中选择“Flash(.swf)”和“Windows放映文件(.exe)”两项，其中生成的“.swf”文件可嵌入到其它的课件中，生成的“.exe”文件是可执行文件，可以在任何计算机配置和环境下运行。（如图5所示）

图5
总结
本文介绍了一种使用Flash中的UI组件制作填空题的方法 ，这种方法优点很明显，首先由于所有的元件都是自己制作，所以可以根据需要为元件进行个性化的定制；其次，也是最重要的，这种方法中运用了UI（User Interface）组件中的动态文本，易于收集和反馈信息，实现了人机实时交互功能。

参考文献：
【1】关晓娟 高军锋 Flash CS3 专家案例课堂 兵器工业出版社 北京希望电子出版社 2008
【2】智丰工作室 Flash CS3 动画制作入门与提高 科学出版社 北京希望电子出版社2008
12