Flash脚本进阶案例教程.docx
《Flash脚本进阶案例教程.docx》由会员分享，可在线阅读，更多相关《Flash脚本进阶案例教程.docx（18页珍藏版）》请在冰豆网上搜索。
Flash脚本进阶案例教程
案例一：
进度条的制作
下面是进度条模拟演示的一个界面：
（一）脚本函数讲解：
getBytesTotal（）;
getBytesLoaded（）;
gotoAndStop（）;
If判断语句
（二）具体实现步骤：
（1）新建flash文档，文档大小为500X400像素，背景为白色。
（2）单击菜单栏的“插入-创建新元件”打开“创建新元件”对话框，在打开的“创建新元件”对话框的名称栏中输入“进度条”，在类型选项中选择“影片简介”，单击“确定”。
创建并进入“进度条”影片简介的编辑状态。
（3）在“进度条”影片剪辑的编辑状态，单击工具箱的“矩形工具”，在属性面板中设置笔触颜色为黑色，笔触高度为2pts，填充色为“黄色”。
单击选中图层1第一帧，在舞台工作区绘制一个有笔触和填充的矩形。
（4）在图层1之上新建图层2，单击选中图层1第一帧绘制的矩形的填充颜色，通过快捷键“ctrl+x（或菜单栏的“编辑-剪切”命令）”将填充颜色剪切出来，然后使用快捷键“ctrl+shift+v”将填充颜色粘贴到原位置（或使用菜单栏的“编辑-粘贴到当前位置”命令）。
（5）调整图层2到图层1的下面，选中图层1的第100帧按F5创建普通帧。
选中图层2第100帧按F6创建关键帧，单击选中图层2第一帧，将矩形填充的宽度设置为1像素，单击图层2第一帧，在属性面板中将补间选项选择“形状”。
创建图层2第1帧至第100帧的形状动画。
（6）返回主场景，在主场景中新建4个图层，对图层进行重命名，从上到下图层的名称分别是：
ActionScript、jdt、button、动画。
（7）单击ActionScript层的第一帧，在属性面板中设置帧标签为“Start”，这时在时间轴上会出现一面小红旗，选中该帧，按F9调出“动作”面板，在动作面板的代码窗口输入代码：
total=_root.getBytesTotal（）;
//将动画的总字节数赋值给变量total；
loaded=_root.getBytesLoaded（）;
//将已下载的字节数赋值给变量loaded；
load=int（loaded/total*100）;
//取整计算已下载的字节数的百分比并赋值给变量load；
loadtxt="loading"+load+"%";
//把已下载的字节数赋值给动态文本变量loadtxt；
_root.jdt.gotoAndStop（load）;
//进度条同时按照百分比数跳转到相应的帧上；
（8）单击选中ActionScript层第6帧，按F9打开“动作”面板，在打开的“动作”面板的代码窗口输入代码：
if（loaded==total）
//判断下载的字节数是否与动画总的字节数相等；
{gotoAndStop（6）;}
//如果两者相等，则动画跳转并停止在第六帧；
else{gotoAndPlay（"Start"）;}
//如果两者不相等，则跳转到标签名”Start”的帧上，继续下载
（9）单击选中jdt图层的第一帧，将库中制作好的“进度条”影片剪辑拖曳到舞台工作区的适当位置，选中“进度条”元件，在属性面板中为实例进行命名：
jdt，单击选中该图层的第6帧按F5插入普通帧。
（10）单击选中“jdt”图层的第一帧，单击工具箱的“文本工具”在其属性面板中设置文本类型为“动态文本”，字体为“宋体”，字号为“20号”，字体颜色值为“#FF00FF”，在变量栏中输入“loadtxt”（动态文本将调用ActionScript层第一帧代码当中loadtxt的值）
（11）单击选中“button”图层的第6帧，单击“窗口-公用库-按钮”打开“按钮”库，在库中选中一个按钮拖曳到舞台工作区（或者自己创建一个按钮元件），右键单击按钮，在弹出的右键菜单中选择“动作”命令，打开“动作”面板，在代码窗口中输入代码：
on（release）
{gotoAndPlay（7）;}
//释放鼠标左键，跳转到第第七帧开始播放
（12）单击选中“动画”图层第7帧，将库中制作好的动画拖曳到舞台工作区的适当位置。
（13）通过ctrl+enter进行测试影片。
在测试的过程中为了使动画显示更加逼真，在flash播放器的“视图-下载设置”命令中设置下载速度为1.2kb/s，再单击“视图-模拟下载”命令，你即可以看到进度条的播放了。
案例二雪花飘舞案例
下面是动画播放的一个界面：
（1）脚本函数讲解：
duplicateMovieClip（"元件名称"，新元件名称，深度）
用于在影片播放时创建影片剪辑的实例，即复制场景中的父影片剪辑以产生新的影片剪辑。
其中“元件名称”是影片剪辑实例的名称，“新元件名称”是对复制出来的影片剪辑实例所命的名字，“深度”用来定义影片剪辑实例的层次，值越大越前端显示。
setProperty（"实例名称"，属性，属性值）
用于设置影片剪辑实例的属性值。
如：
setProperty（"a"+i,_x,random（500）;表示用随机宽度设置新影片"a"+iX的位置属性。
1、_x和_y属性代表影片剪辑在场景中的水平坐标和垂直坐标。
如：
setProperty（"mc",_x,"50"）;//设置影片剪辑mc在主场景中的水平坐标为50
2、_xmouse和_ymouse属性分别代表光标的水平坐标位置和垂直坐标位置。
如果该关键字是在主时间轴上，则它们是相对于主场景的坐标位置，如果该关键字用在影片剪辑中，则表示是鼠标光标相对于该影片剪辑的坐标位置。
二者是以坐标原点开始计算。
主时间轴中代表光标与坐上角之间的距离，在影片剪辑中代表光标与影片剪辑中心之间的距离。
3、_alpha属性决定了影片剪辑和按钮的透明程度，它的范围在0~100之间，0表示完全透明，100表示不透明。
如：
setProperty（"button",_alpha,50）;//设置按钮实例button的透明值为50%。
4、_rotation属性代表影片剪辑的旋转方向，它是一个角度值，介于-180°—180°之间，可以使整数和浮点数。
如：
setProperty（miao,_rotation,time.getMinutes（）;）
（二）具体实现步骤：
（1）设置舞台大小为：
440×400像素，背景颜色为黑色。
（2）执行“插入-新建元件”命令，打开新建元件对话框，在名称栏中输入“雪花”，类型选择为“图形”。
单击确定。
（3）单击工具，设置其笔触颜色为白色，笔触高度为3pts，在舞台工作区绘制雪花的一片，绘制完成后组合。
（4）调出变形面板，在旋转对话框中输入60度，单击复制并应用变形5次。
绘制出一个六叶雪花。
（5）执行“插入-新建元件”命令，打开新建元件对话框，在名称栏中输入“雪花下落”，类型选择“影片剪辑”单击“确定”进入该影片剪辑的编辑状态。
（6）单击图层1第一帧，将绘制的“雪花”元件拖曳到该影片剪辑，在图层1之上新建引导层，用铅笔工具绘制一条平滑曲线。
在图层1第30帧插入关键帧，调整图层1第1帧和第30帧雪花元件的中心位置在引导层的起始端点上。
（7）创建图层1第1帧至第30帧的补间动画。
在图层1第31帧插入空白关键帧，打开动作面板输入：
stop（）;
（8）执行“插入-新建元件”命令，打开新建元件对话框，在名称栏中输入“雪花飞舞”，类型为“影片剪辑”，单击确定。
进入该影片剪辑的编辑状态。
（9）单击图层1第1帧，将“雪花下落”影片剪辑拖曳到舞台工作区，将实例名称修改为“mc”，单击第20帧插入普通帧。
（10）在图层1之上新建图层2，单击选中图层2第一帧，打开动作面板在其中输入代码：
c=1;
（11）单击图层2第2帧，输入代码：
functionaa（）{
duplicateMovieClip（"mc",c,c）;
setProperty（c,_x,random（400））;
setProperty（c,_y,random（450））;
updateAfterEvent;
c++;
if（c>40）{clearInterval（kk）;
}
}
kk=setInterval（aa,20）;
下面是雪花飞舞影片剪辑的图层分布：
（12）通过ctrl+enter测试影片。
案例三跟随鼠标移动的小鸟
下面是动画播放时的一个画面：
（1）脚本函数讲解
startDrag（）函数
startDrag（target）
startDrag（target,[lock]）
startDrag（target[,lock[left,top,right,buttom]]）
该函数用来设置鼠标可以拖曳舞台工作区的一片剪辑实例。
Target是要拖曳的对象，lock参数是指是否以锁定中心拖曳，参数left,right,top,bottom是拖曳的范围。
如：
startDrag（实例名称）。
stopDrag（）函数参数，其功能是用来停止鼠标拖曳影片剪辑实例。
（二）具体实现步骤
（1）新建flash文档，设置其大小为：
300×300像素，背景颜色为“白色”。
（2）单击“文件-导入-导入到库”菜单命令，调出“导入到库”对话框，将“小鸟.gif”图片导入到库中。
（3）将库中生成的“小鸟”影片剪辑拖曳到舞台工作区，产生5个实例。
设置5个实例的透明度分别是10%、30%、50%、70%、90%
（4）在属性面板中为小鸟实例进行命名，其实例名称分别是：
b1,b2,b3,b4,b5。
（5）单击选中“图层1”图层在第1、2、3、4、5帧处插入关键帧。
在“图层1”图层第1帧按F9打开“动作”面板，在其中输入代码：
startDrag（“b1”,true）;//可以用鼠标拖曳b1影片剪辑
（6）用同样的方法分别在：
“图层1”图层第2、3、4、5帧处添加代码：
startDrag（“b2”,true）;//可以用鼠标拖曳b2影片剪辑
startDrag（“b3”,true）;//可以用鼠标拖曳b3影片剪辑
startDrag（“b4”,true）;//可以用鼠标拖曳b4影片剪辑
startDrag（“b5”,true）;//可以用鼠标拖曳b5影片剪辑
至此，“跟随鼠标移动的小鸟”动画制作完毕。
案例四电子时钟
下面是动画播放时的一个界面
（1）脚本函数讲解
1、Date函数的构造
在flash中使用Date函数时，首先需要构造一个新的Date对象，该对象用来保存指定的日期和时间。
常用的日期和时间表示方法：
date=newDate（）;//当前时间
date=newDate（2010,5,1）;//2010年6月1日星期六0:
00:
00。
date=newDate（73,4,6,10,30,18,9）;//1973年5月6日星期日10:
30:
18
date=newDate（-11370521080）;//1969年8月22日星期五17:
31:
18
date=newDate（11370521080）;//1970年5月12日星期二22:
28:
41
Date（）函数参数解释：
1、年：
是0至99之间的整数值，表示1900年至1999年；否则，必须指定表示年份的所有4位数字。
2、月：
0（一月）到11（十二月）之间的整数。
所以要想正确显示当前月份需在取出的月份上加1（即：
month=date.getMonth（）+1;）
3、日：
1到31之间的整数。
4、时：
0（午夜）到23（晚上11点）之间的整数。
5、分：
0到59之间的整数。
6、秒：
0到59之间的整数。
7、毫秒：
0到999之间的整数。
8、时间值（例4中的-14159025000）：
毫秒数，负值表示GMT时间1970年1月1日0:
00:
00之前的某个时间，而正值表示该时间之后的某个时间。
2、函数的作用
要使用以下的时间函数，必须要先构造一个新的Date对象。
构造一个新的Date对象：
date=newDate（）;
1、年份函数
year=date.getFullYear（）;
//将Date对象中的完整年份值（4位数）赋值给变量year
2、月份函数
month=date.getMonth（）;
//将Date对象中的月份值赋值给变量month，实际月份应该是month=date.getMonth+1;
3、日函数
date1=date.getDate（）;
//将Date对象中表示月中某天的值（1到31之间的整数）赋值给变量date1
4、星期函数
week=date.getDay（）;
//将Date对象中表示星期的值（0代表星期日，1代表星期一，依此类推）赋值给变量week
5、小时函数
hours=date.getHours（）;
//将Date对象中的小时值（0到23之间的整数）赋值给变量hours
6、分钟函数
minutes=date.getMinutes（）;
//将Date对象中的分钟值（0到59之间的整数）赋值给变量minutes
7、秒钟函数
seconds=date.getSeconds（）;
//将Date对象中的秒钟值（0到59之间的整数）赋值给变量seconds
8、毫秒函数
millseconds=date.getMilliseconds（）;
//将Date对象中的毫秒数（0到999之间的整数）赋值给变量millseconds
9、时间值函数
time=date.getTime（）;
//将Date对象自1970年1月1日午夜（通用时间）以来的毫秒数
10、其他时间和日期函数
getTimezoneOffset 获取当前时间和UTC格式的偏移值（以分钟为单位）
getUTCDate 获取UTC格式的当前日期（本月的几号）
getUTCDay 获取UTC格式的今天是星期几（0-Sunday,1-Monday...）
getUTCFullYear 获取UTC格式的当前年份（四位数字）
getUTCHours 获取UTC格式的当前小时数（24小时制,0-23）
getUTCMilliseconds 获取UTC格式的当前毫秒数
getUTCMinutes 获取UTC格式的当前分钟数
getUTCMonth 获取UTC格式的当前月份（注意从0开始:
0-Jan,1-Feb...）
getUTCSeconds 获取UTC格式的当前秒数
getYear 获取当前缩写年份（当前年份减去1900）
newDate 新建日期时间对象
setDate 设置当前日期（本月的几号）
setFullYear 设置当前年份（四位数字）
setHours 设置当前小时数（24小时制,0-23）
setMilliseconds 设置当前毫秒数
setMinutes 设置当前分钟数
setMonth 设置当前月份（注意从0开始:
0-Jan,1-Feb...）
setSeconds 设置当前秒数
setTime 设置UTC格式的从1970.1.10:
00以来的秒数
setUTCDate 设置UTC格式的当前日期（本月的几号）
setUTCFullYear 设置UTC格式的当前年份（四位数字）
setUTCHours 设置UTC格式的当前小时数（24小时制,0-23）
setUTCMilliseconds 设置UTC格式的当前毫秒数
setUTCMinutes 设置UTC格式的当前分钟数
setUTCMonth 设置UTC格式的当前月份（注意从0开始:
0-Jan,1-Feb...）
setUTCSeconds 设置UTC格式的当前秒数
setYear 设置当前缩写年份（当前年份减去1900）
toString 将日期时间值转换成"日期/时间"形式的字符串值
UTC 返回指定的UTC格式日期时间的固定时间值
11、setInterval（）函数
该函数可实现每隔多少毫秒调用一次某函数。
用法：
变量名称=setInterval（要调用的函数名称，间隔的毫秒数）；
12、clearInterval（）函数
该函数停止setInterval（）函数的调用，不让其再调用函数
用法：
clearInterval（存储有setInterval函数的变量名称）；
13、setTimeout（）函数
在隔多少毫秒后，调用某函数。
与setInterval函数不同的是它只调用一次，然后自动删除，而不是反复调用。
用法与setInterval函数一样。
用法：
变量名称=setTimeout（定义的函数名称，间隔的毫秒数）；
14、clearTimeout（）
作用是用来阻止setTimeout调用函数
用法clearTimeout（存储有setTimeout函数的变量）；
具体使用的方法：
1、显示当前年、月、日
date=newDate（）;
date1=date.getFullYear（）+"年"+（date.getMonth（）+1）+"月"+date.getDate（）+"日";
2、显示当前时、分、秒
date=newDate（）;
date2=date.getHours（）+"时"+date.getMinutes（）+"分"+date.getSeconds（）+"秒";
3、动态显示当前时、分、秒
functiona（）//定义函数a
{date=newDate（）;//创建Date对象date
h=date.getHours（）;//获取系统的小时赋值给变量h
if（h<10）
{h0="0"+h;}//判断如果小时值小于10在小时前面添加0
else{h0=h;}//否则不添加
if（h>23）
{h0=h0%24;}//判断如果系统小时大于23时小时数以24取余
m=date.getMinutes（）;//获取系统的分钟值赋值给变量m
if（m<10）{m0="0"+m;}//判断如果获取的分钟数小于10，在分钟值前添加0
else{m0=m;}//否则不对分钟数做修改
s=date.getSeconds（）;//获取系统的秒值赋值给变量s
if（s<10）{s0="0"+s;}//判断如果秒数值小于10，在其值前面添加0
else{s0=s;}//否则不做修改
time=h0+":
"+m0+":
"+s0;}//将系统是时、分、秒值之间用：
连接起来赋值给变量time
setInterval（a,20+int（random*100））;//每隔20+int（random*100）毫秒调用函数a一次
（2）具体实现步骤
（1）新建flash文档，文档大小300X300像素，背景颜色“白色”。
（2）单击工具箱的“文本工具”，设置其属性值：
文本类型为“动态文本”。
文本字体为“宋体”，文本字号为30磅，字间距为6，变量值为time，设置文本多行显示。
（3）用步骤
（2）的方法创建另外两个动态文本week1和time1。
两个动态文本的属性值分别是：
week1:
宋体、52号、蓝色、字间距6
time1：
宋体、30号、蓝色、字间距6
（4）单击选中图层一第一帧，按F9打开“动作”面板，在动作面板中输入以下代码：
_root.onEnterFrame=function（）{
varmydate=newDate（）;
nian=mydate.getFullYear（）;
yue=mydate.getMonth（）;
ri=mydate.getDate（）;
week=mydate.getDay（）;
shi=mydate.getHours（）;
fen=mydate.getMinutes（）;
miao=mydate.getSeconds（）;
yue=yue+1;
if（week==0）{weektxt="星期日"}
elseif（week==1）{weektxt="星期一"}
elseif（week==2）{weektxt="星期二"}
elseif（week==3）{weektxt="星期三"}
elseif（week==4）{weektxt="星期四"}
elseif（week==5）{weektxt="星期五"}
elseif（week==6）{weektxt="星期六"}
if（shi>12）{shi=shi-12;
shitxt="下午"+shi;}
elseif（shi<12）
{shi=shi;
shitxt="上午"+shi;}
elseif（shi==12）
{shitxt="中午"+shi;}
time="今天是"+nian+"年"+yue+"月"+ri+"日";
week1=weektxt;
time1="现在是"+shitxt+"时"+fen+"分"+miao+"秒";
}
最终时间轴效果
（5）通过ctrl+enter进行测试。
升级会员 