【实现效果】
(1)展开课件后,单击“播放”按钮,就会听到课文朗读的声音,并在相应的句子下面自动画线,以提示所读到的具体位置,当课文朗读完毕,所有画线全部消失。在播放的过程中,单击“暂停”按钮,声音暂停下来,单击“播放”按钮,朗读继续,单击“停止”按钮,恢复到初始状态。
(2)在播放的过程中,下方中间的滑块显示播放进度,你可以任意拖动滑块实现朗读的跳转并继续播放,并在右边的动态文本框中动态地显示播放的具体百分比,让你掌握播放进度。
(3)在播放的过程中,你可以任意调节音量的大小,拖动音量控制滑块圆形按钮,向左音量减小,一直到无声音,向右拖动音量增大。
(图1)
【制作分析】
打开该课件,它是一个影片剪辑,在场景中的实例名称为“zp”,如图2。
(图2)
双击该影片剪辑,进入其编辑级别,可以看到该影片剪辑一共用了七层,从下至上分别为底层、按钮、音量控制、百分比、进度显示、课文、as。
(图3)
◎底层:放置背景图片。
◎按钮层:放置用来放置播放按钮、暂停按钮、停止按钮。
◎音量控制层:用来放置音量控制影片剪辑。
◎百分比层:放置一个动态文本框,用以显示播放进度的具体百分比。
◎播放进度条层:放置一个长条,以作为播放进度条。
◎播放滑块层:放置可以拖动的并显示播放进度的滑块。
◎课文层:用来放置一个带有画线效果的朗读动画,该动画为一个影片剪辑。
◎as层:编写相关代码。
【制作步骤】
1.制作背景。
在flash文档中,将图层1更名为底层。制作如图4所示的背景,用以美化课件。
(图4)
2.制作按钮。
本例中有一些按钮没有实在意义,仅起到装饰作用。主要完成的是播放按钮、暂停按钮、停止按钮。播放按钮和暂停按钮是二合一按钮,因而要做成一个影片剪辑。双击该影片剪辑进入其编辑级别,可以看到一共用了两层两帧,第一层第一帧为一个表示播放的按钮,第二帧为一个表示暂停的按钮。第二层为代码层,分别为stop()停止命令,如图5,在场景中的实例名称为bf。制作好播放、暂停按钮后,还需制作一个停止按钮,你可以制作为一个影片剪辑,也可以制作为一个按钮。返回场景,新建一层为“按钮层”,将制作好的按钮拖入该层第一帧,并摆放好位置。
(图5)
3.制作音量控制
音量控制层一个影片剪辑,在场景中的实例名称为ylkz。双击进入编辑级别,可以看到它共有3层,又分别为底层、滑块、代码。底层放一图形元件,宽度为100,滑块层放一个按钮,实例名称为y。
4.进度百分比
新建一图层,取名为进度百分比,用文本工具(动态文本)在右下方画一个动态文本框,变量名为txt,如图。
5.制作播放进度条
制作一影片剪辑长条,放于如下图所示的框内,取实例名称为jdt。
6.制作播放滑块
在播放进度条层上方新建一层,命名为“播放滑块”,用椭圆工个绘一个圆形影片剪辑,放于播放进度条之上,取实例名称为hk。
7.课文朗读
该层放一个朗读动画影片剪辑,在场景中的实例名称为langdu。
【编写代码】
1.播放影片剪辑内部按钮代码:
(1)双击播放按钮,进入编辑级别,在第一帧选中表示播放的按钮,打开动作面板,输入代码:
on (release) {
gotoAndStop(2);
_root.zp.langdu.play();
}
(2)双击播放按钮,进入编辑级别,在第二帧选中表示播放的按钮,打开动作面板,输入代码:
on (release) {
gotoAndStop(1);
_root.zp.langdu.stop();
}
2.停止按钮代码:
选中停止按钮,打开动作面板,输入以下代码:
on (release) {
_root.zp.langdu.gotoAndStop(1);
_root.zp.bf.gotoAndStop(1);
}
3.音量控制代码
(1)双击音量控制影片剪辑,进入编辑级别,选中代码层的第一帧,输入代码:
function shengxing() {
my_sound = new Sound();
my_sound.setVolume(y._x);
}
(2)选中音量滑块,打开动作面板,输入代码:
on (press) {
startDrag("y", true, 0, 0, 100, 0);
qqq = setInterval(shengxing, 20);
}
on (release, releaseOutside) {
stopDrag();
clearInterval(qqq);
}
4.在zp影片剪辑中,选中代码层的第一帧,输入代码:
//滑块代码:
tuodong = true;
hk.onPress = function() {
tuodong = false;
startDrag("hk",false,jdt._x,jdt._y,jdt._x+jdt._width-hk._width, jdt._y);
};
hk.onRelease = function() {
tuodong = true;
stopDrag();
langdu.gotoAndPlay(int(int(langdu._totalframes*(hk._x-jdt._x)/(jdt._width-hk._width))));
};
//滑块与影片同步移动及显示百分比
this.onEnterFrame = function() {
if (tuodong == true) {
hk._x=jdt._x+(jdt._width-hk._width)*langdu._currentframe/langdu._totalframes;
txt=int(Number(langdu._currentframe)/Number(langdu._totalframes)*100)+"%";
}
};