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

  • 格式:doc
  • 大小:272.00 KB
  • 文档页数:13

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

作者:程晓

单位:昌平区职工学校1

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

摘要:使用Flash制作填空题,本文尝试了一种使用脚本编程,按钮和动态文本制作填空题的方法,并对结果统计,计算得分。

关键词:填空题 Flash 脚本编程 纵横码 UI组件

填空题是标准测验课件最主要的题型之一,它的使用范围最广。这种课件充分利用了计算机的交互性、多媒体和智能性,使教育过程中的练习和测验活动变得更加简洁有效。使用Flash中的脚本编程、按钮元件和动态文本来实现制作填空题,在制作过程中充分运用UI(User Interface)组件,这种方法便于课件界面的设计和信息的收集,更能实现计算机与使用者之间的交互,下面以纵横码填空题课件的制作为例来说明其制作过程

一、 课件介绍

首先介绍一下课件,课件的界面如图1所示,使用时,用户在横线上填写正确的纵横码编码,共十道填空题,每题十分。在所有题目做完并且检查无误后,点击提交按钮。交卷后,课件会根据用户填写的内容做出判断,在正确的题目后显示“√”,在错误的题目后面显示“ⅹ”,点击答案按钮可显示正确的答案。在右上角成绩统计区域呈现总得分。(如图1所示) 2

图1

二、 制作过程

1.制作元件

课件中用到的影片剪辑元件有“正误判断”,用于提示用户填写的正误。按钮元件有“提交” “重做”“答案”“返回”,用于用户的选择。

(1)新建Flash文档。首先从“文件”菜单里单击“新建”命令,新建一个Flash文档,然后把图层1重命名为“背景”,接着在背景图层的第一帧导入一幅自己满意的图片做背景,在第二帧处按F5键把图层延长到第二帧。

(2)制作“正误判断”元件,按下Ctrl+F8键,在创建新元件对话框中输入名称“正误判断”,类型选择影片剪辑,(如图2所示)。3

为第一帧添加脚本“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”。 4

图3

②打开库面板,将新建好的“正误判断”影片剪辑拖放到第一题的后面,形成一个实例,用于显示对错,将此实例改名为“pd1_mc”。分别拖放“正误判断”影片剪辑到其它的题后面,并分别为实例改名,第10题改名为“pd10_mc”。

③新建图层,重命名为“按钮”, 在第1帧处,打开库面板,将“提交”按钮拖放到舞台下方,在属性面板中将其重命名为“tj_btn”。在第2帧处,打开库面板,将“重做” “答案”按钮拖放到舞台下5

方,并分别重命名为“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 = ""; 6

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 = ""; 7

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); 8

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; 9

} 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 { 10

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() { 11

gotoAndPlay(1);//点击返回按钮,回到第1帧

}

da_btn.onRelease = function() {

gotoAndPlay("场景 2", 1);// 点击答案按钮,跳转到场景2的第1帧

};

三、 打包发布

课件制作完成后,按下Ctrl+Enter键进行测试,在课件正常运行后要对课件进行打包发布,方便课件在其它的环境下也能运行,使其具有可移植性。

选择文件菜单下的发布设置选项,在打开的设置面板中选择“Flash(.swf)”和“Windows放映文件(.exe)”两项,其中生成的“.swf”文件可嵌入到其它的课件中,生成的“.exe”文件是可执行文件,可以在任何计算机配置和环境下运行。(如图5所示)

图5