信用卡办理的正规手续:彩虹电子日历时钟的制作原理与过程

教学目的：通过本节教学了解和熟悉动作面板及as语句的添加使用，并学会用脚本来制作电子日历时钟，进而丰富自己的动画内容与技巧，创作出优秀的动画作品。
教学对象：本教材是针对有一定动画制作基础和对属性面板及工具箱、动作面板有所了解的朋友们编制的，因此省略了一些步骤，还望谅解。
教学要点：动态文本、动作面板、as语句。
 
作前准备
准备1张规格为550*400的背景图片，经过制图软件（ps、fw等）处理后，保存在指定的文件夹，待用。
制作步骤
1.启动FLASH8 软件。
2.确立文档属性 设置动画尺寸为550*400，帧频为15，背景颜色黑，其它默认,点击确定，进入场景1。如图1所示：

图1
3.创立影片剪辑元件 选择“插入－新建元件”，建立一个名为背景的影片剪辑，点击确定，进入元件编辑区。添加一个图层，共两个图层。
（1）选择图层1第1帧，导入一张已准备好的背景图片，规格为550*400，选中该图片，左对齐，上对齐。如图2所示：

图2
操作完成后的该实例，如图3所示：

图3
（2）选择图层2第1帧，右键该帧处，打开动作面板，在as编辑区输入如下语句：
/* 定义5个全局变量 */
var time:Number = 0;
var timeMin:Number = 100;
var alphaDrop:Number = 2;
var growBy:Number = 2;
var rotateByMax:Number = 10;
/* 转变弧度的函数 */
function deg2rad(degrees:Number):Number {
return degrees * Math.PI / 180;
}
/* 返回最大值和最小值之间的一个数 */
function randRange(min:Number, max:Number):Number {
var randomNum:Number = Math.floor(Math.random() * (max - min + 1)) + min;
return randomNum;
}
/* 绘制规则多边形，设置颜色、大小、半径 */
function drawPoly(sides:Number, color:Number, radius:Number):MovieClip {
var depth:Number = _root.getNextHighestDepth();
var poly_mc:MovieClip = _root.createEmptyMovieClip("poly" + depth, depth);
var unitAngle = deg2rad(360/ sides);
poly_mc.beginFill(color);
poly_mc.moveTo(radius, 0);
for (var i:Number = 1; i < sides; i++) {
var turn:Number = unitAngle * i;
var dx:Number = Math.cos(turn) * radius;
var dy:Number = Math.sin(turn) * radius;
poly_mc.lineTo(dx, dy);
}
poly_mc.endFill();
return poly_mc;
}
/* 初始化一个影片剪辑 */
function initPoly():Void {
this._x = _xmouse;
this._y = _ymouse;
this._xscale = this._yscale = 0;
this.rotateBy = randRange(-rotateByMax, rotateByMax);
this.onEnterFrame = function():Void {
this._xscale = this._yscale += growBy;
this._alpha -= alphaDrop;
this._rotation += this.rotateBy;
if (this._alpha < 0) {
this.removeMovieClip();
}
};
}
/* 主程序 */
onMouseMove = function():Void {
if (getTimer() - time > timeMin) {
initPoly.apply(drawPoly(randRange(3, 12), randRange(0, 0xFFFFFF), 100));
time = getTimer();
}
};
4.组织编辑场景 返回场景1，添加三个图层，共四个图层。自下而上分别命名为背景、文本、as、边框。
（1）选择背景图层第1帧，从库中拖出背景影片剪辑到场景工作区，全居中。在第2帧插入帧。上锁。
（2）选择文本图层第1帧，用文本工具设置其参数如图4所示：

图4
选用动态文本，在舞台拖出五个文本框，再用静态文本输入相关面容。其参考位置，如图5所示：

图5
自上而下，自左而右分别依次选中各个动态文本框，先后在变量中确定其变量名称为yeahtext、daytext、weektext、half、timetext。在第2帧插入帧。上锁。如图6所示：

图6
（3）选择as图层第1帧，右键该帧处，打开动作面板，在as编辑区输入如下语句：
// 创建新的日期对象
time = new Date();
// 把系统当前的时钟值赋给变量hour
// 把系统当前的分钟值赋给变量minute
// 把系统当前的秒种值赋给变量second
hour = time.getHours();
minute = time.getMinutes();
second = time.getSeconds();
milli = int(time.getMilliseconds()/10);
// 如果分钟值是一位数，就在前面加一个0
if (minute<10) {
minute = "0"+minute;
}
// 如果秒钟值小于10，就在前面加一个0
if (second<10) {
second = "0"+second;
}
if (milli<10) {
milli = "0"+milli;
}
// 如果时钟值小于12，则在half文本框里显示AM（午前），否则显示为PM（午后）
if (hour<12) {
half = "上午";
} else {
half = "下午";
}
// 把系统的当前年份显示在yeahtext文本框里
yeahtext = time.getFullYear();
// 把系统的当前日期显示在daytext文本框里
daytext = time.getMonth()+1+" 月 "+time.getDate()+" 日";
// 把系统的当前星期显示在weektext文本框里
weektext = "星期 "+time.getDay();
// 把系统的当前时间显示在timetext文本框里
timetext = hour+":"+minute+":"+second+":"+milli;
在第2帧插入帧。锁定该图层。
（4）选择边框图层第1帧，导入或制作一个边框，规格为550*400，全居中。在第2帧插入帧。上锁。
此环节完成后的实例显示，如图7所示：

图7
5.该作业完成后的时间轴如图8示：

图8
6.测试存盘
*说明：
此教程中的脚本含有鼠标跟随、日历和时钟多种特效。你可以应用这个原理和操作，创作出生动别样的精彩动画作品。如有兴趣就试试吧。
最终效果显示：
',1)">