韩中保
(盐城卫生职业技术学院解剖学教研室,江苏 盐城 224006)
运用Flash AS+XML制作网络版《人体骨骼肌图解使用手册》
韩中保
(盐城卫生职业技术学院解剖学教研室,江苏 盐城 224006)
结合彩图和线图,介绍了利用Flash AS+XML制作网络版《人体骨骼肌图解使用手册》,只要学习者输入正确的骨骼肌名称,便会立即呈现相关的图片、动画及文字说明的过程。该图解手册可使教学活动灵活方便,也便于学生复习使用,具有较高的使用推广价值。
Flash AS;人体骨骼肌;图解;查询;动态呈现
依据专业培养目标要求,《人体解剖学》中的运动系统和神经系统是康复治疗技术专业教学中非常重要的两个章节,要求学生对每块骨骼肌的起止、作用、神经支配都要十分清楚。而仅仅借助于书中的图片、模型或标本,学生是很难理解的,因为都没有单块骨骼肌的示范。在教学过程中为了解决这一问题,需要绘制几十张不同关节部位的骨骼图片,印刷后给每位学生,要求在相关的图片上用点和线标明每块骨骼肌的起止点。先按跨越关节的不同画一份,然后再按作用相近的画一份,这样,学生很自然地就搞清楚了每块骨骼肌的作用。并且在此基础上,又参考了一些解剖学图谱,运用Flash AS+XML(AS即ActionScript的缩写)制作了网络版《人体骨骼肌图解使用手册》,只要操作者输入正确的骨骼肌名称,便会立即呈现相关的图片、动画及文字说明,使教学活动更加灵活方便,也便于学生的复习使用,具有较高的使用推广价值[1]。
运用Flash AS+XML制作网络版《人体骨骼肌图解使用手册》主要是通过用户直接输入骨骼肌名称,程序自动呈现相关的动画和说明内容。所以,首先要判断用户输入的名称不要出现空、错误和不包含在程序中的字符串;第二,程序分主程序和各骨骼肌的动画文件,主程序通过加载外部.swf文件的形式呈现;第三,各骨骼肌动画文件中主要包括有与教材相近的骨骼肌彩图,自绘的简线图,骨骼肌的起点、止点、作用及神经支配等相关文字信息。
2.1 XML()对象
使用构造函数new XML()创建XML对象,加载外部XML文档,并读取元素属性值。由于程序是网络形式运行,不能通过访问本地磁盘、文件形式读取相关文件及文件名,因此,通过创建XML对象,将各骨骼肌动画文件的文件名以XML元素的属性形式存储信息,便于Flash查询和读取[2]。
2.2 事件响应和条件判断
用户输入的信息是通过提交按钮触发动作的鼠标事件运行,再通过返回按钮进行数据清除,因此要运用on(release){执行语句}处理函数控制程序走向。
判断用户输入的名称不要出现空、错误和不包含在程序中的字符串,因此使用if(条件){执行语句}else{执行语句},进行条件判断,然后产生相应的运行结果。
2.3 循环语句和Array()对象操作
创建Array()对象,通过for(初始化;循环条件;步进语句){循环执行的语句}将XML文件中元素属性中的各骨骼肌名称组成数组,并转换成字符串格式,通过indexOf(要查询的字符串)进行查询判断。
2.4 加载外部.swf文件
通过createEmptyMovieClip()创建一影片剪辑,设置其如位置、大小等相关属性,再利用loadMovie()加载外部.swf文件。
3.1 素材准备
收集的相关彩色图片,主要来源于Ciba Medical Education&Publications 1995年出版的《Interactive Atlasof Human anatomy》光盘[3],用 Photoshop 工具处理图片,去除标签及其他处理,并以GIF或JPG格式保存。线图主要以部分参考书的图为底板,利用绘图数位板手绘[4-6],这是因为大多数参考书中的线图上仍有很多标签,经过扫描输入后,还必须用Photoshop工具处理,很耗时,没有绘图板方便快捷。
3.2 各骨骼肌动画制作
每个骨骼肌动画文件以骨骼肌名称命名,并存放在同一目录内的Flash的文件夹下,以便主程调用。制作时先分别导入骨骼肌彩图和线图,在彩图区标明骨骼肌名称和结构范围,在线图区分别标明起止点区、作用、支配神经及相应说明,并逐一显示;利用遮罩效果,表现骨骼肌走行[7]。
3.3 主程序设计
①建立XML文件如下,以存放各骨骼肌名称:
<动画>
<骨骼肌 名称="胸大肌"/>
<骨骼肌 名称="胸小肌"/>
……
</动画>
②新建场景取名loading,添加AS语句,以加载外部XML文件,成功后进入main场景。
var muscle_XML=new XML();
muscle_XML.ignoreWhite=true;
muscle_XML.load("skeletal_muscle.xml");
muscle_XML.onLoad=function(){
gotoAndStop("main",1);
}
③新建场景取名为main,第一帧添加输入文本框,变量名为"txt";制作两个按钮“提交”和“重填”,分别添加如下代码:
提交按钮:on(release){
if(txt==""){
gotoAndStop(2);
}else{
gotoAndStop(3);
}
}
重填按钮:on(release){
txt="";
}
④在第二帧和第四帧分别添加用户输入信息提交后的错误提示。第三帧添加AS语句,进行正确信息的判断,加载外部swf文件。
//将输入的字符串去除空格;
var txt:String=allTrim(_root.txt);
//防止用户输入单字符或两个连续的字符而通过了后面的判断,但却找不到相关的文件,从而导致程序运行错误;
var m:Number=input_txt.indexOf("肌");
if(m>=0){
var txt:String=input_txt;
}else{
txt=input_txt+"肌";
}
//定义一个新数组,以存放从XML中读取的结构名称;
var muscle:Array=new Array();
var e=muscle_XML.firstChild.childNodes;
for(var i=0;i < e.length;i++){
muscle.push(e[i].attributes.名称);
}
//将数组转变成字符串,以便进行输入字符串的配位查询;如果存在则返回">=0"的数值,如果不存在,则返回"-1"。从而判断程序的走向。
var muscle_string:String=muscle.join("+");
var back_num:Number=muscle_string.indexOf(txt);
if(back_num>=0){
this.createEmptyMovieClip("muscle_MC",3);
muscle_MC._x=40;
muscle_MC._y=170;
loadMovie("flash/"+txt+".swf",muscle_MC);
}else if(back_num=-1){
gotoAndStop(4);
}[8]
在服务器如D盘中,新建一文件夹名为muscle,将主程序在内的文件发送至此,利用Dream weaver将主程序.swf文件插入网页文件中,保存为index.htm在服务器IIS管理器中进行网站设置,主要有网站的文件路径、主文件头等,并设定服务器在校园局域网的IP,最终,客户端用户在IE地址栏中输入IP就可调用主程序,查看相关内容。
图1 查询结果界面
康复专业的解剖学教学过程中,讲解每一块骨骼肌时,教师只要进入学校局域网,输入相关IP地址,便可随时调用相关的骨骼肌动画及说明,利用投影机,展示给学生(如图1所示)。由于有简线图,骨骼肌的起止点非常清晰,所以学生较易接受和理解。学生也可利用学校局域网,随时调用,进行复习。在实际的教学过程中,我们还要求学生参照此学习手册,自已绘图复习。通过此方法,学生对每一块骨骼肌的起止点和作用掌握得较好,总体上提高了教学效果。
该程序主要是通过查询的形式来调用相关的骨骼肌动画信息,未采用一级二级菜单形式[9],调用较为方便。因为是网络版,所以程序未采用直接读取本地文件名的形式,而是将各动画文件以骨骼肌名称命名并组成XML文件,再加以调用,具有一定的安全保护功能。另外,程序对用户输入的字符串进行判断,这样可以避免程序出错。因为是单个调用,在主序中进行动态加载相关骨骼肌动画文件,所以,主程序文件很小,便于在网上传输,用户操作时可即输即现,体现了富客户端(RIA)的设计思想[10]。
[1]虞琴.计算机辅助教学(CAI)课件在《人体解剖学—运动系统》教学中的应用体会[J].临床和实验医学杂志,2006,5(3):218-220
[2]蒋国强.ActionScript3.0完全自学手册[M].北京:机械工业出版社,2009:68-285
[3]Arthur F.Dalley,ll,Ph.D J.Hurley Myers,Ph.D Interactive Atlasof Human anatomy[CP].Ciba Medical Education &Publications,1995:24-324
[4]周天健,邹元植.骨科医师临床应用神经肌肉诊断检查图解(第一分册)[M].北京:人民卫生出版社,1992:2-223
[5]Kahle.w.人体解剖学及彩色图谱[M].山东:山东科学技术出版社,2001:74-324
[6]吴先国,覃好君.解剖组织胚胎学简图及画法[M].北京:人民卫生出版社,1997
[7]Action应用:Flash AS与 XML数据交互[EB/OL].http://www.xue5.com/itedu/200902/283185.html,2009-02-13
[8]胡伊乐,李伟,陆富生.人体解剖学神经传导Flash动画的制作[J].解剖学杂志,2006,29(3):380-381
[9]王真富,余文富.基于+Flash+的人体解剖彩色图谱的设计制作[J].中国医学教育技术,2005,19(4):301-304
[10]郭世强.基于Flash的RIA开发技术[EB/OL].http://media.ccidnet.com/art/3021/20070815/1178789_1.html,2007-08-15
Using Flash AS+XML to develop the
network-based Graphic Manual of Human Skeletal Muscles
Han Zhongbao
(Department of Anatomy,Yancheng Health Vocational and Technical College,Yancheng 224006,China)
By using color pictures and profile charts,this paper introduces how to develop the network-based Graphic Manual of Human Skeletal Muscles with Flash AS+XML.As long as users input the correct name of skeletal muscles,the computer would immediately present relevant pictures,animation and texts.This manual can make teaching activities more flexible and convenient,and help students review and use,thus boasting a high value of application and popularization.
Flash AS;human skeletal muscle;graphic;query;dynamic presentation
G434
A
1004-5287(2011)02-0140-03
江苏省卫生厅医学科技发展基金科研课题“构建《正常人体学》网络课程”(j200605)
2010-09-21
韩中保(1966-),男,江苏盐城人,副教授,主治医师,学士,主要研究方向:多媒体技术、网络课程建设。