基于flash的多媒体课件设计与实现_(编辑修改稿)

基于flash的多媒体课件设计与实现_(编辑修改稿)内容摘要：

太多整个页面看上去就很单调了，所以根据简单的原则直接在每个页面内设置一个返回目录的按钮，这样再进行重新选择就比较简单、直观了。 10 总体设计的流程图如图 31 所示： 图 31 总体流程图 整 体结构 本课件主要采用“化整为零，分而治之”的模块设计方法，如图32 所示。 根据课件的内容，将其分解为一个主控模块和三个功能模块，四个模块都要制作成独立的 Flash 影片。 控制模块 内容 各章习 题 上机习题 11 图 32 结构模型 主控模块主要用来控制和调度各个功能模块的播放，因此主要是设计一个导航菜单。 导航菜单由若干按钮组成，按钮和课件的功能模块相对应，单击导航菜单中的按钮可以载入相应的课件功能模块 SWF影片，在每个功能模块影片中也设计一个返回到主控模块的按钮。 这些导航按钮上的程序代码的 一般形式，如图 33 所示，程序代码的功能是，当单击并释放按钮时，加载指定的 SWF 影片。 图 33 导航按钮上的程序代码 各个课件功能模块具体实现相应课件内容的展示，为第 一、第二 章节。 利用 LoadMovie()函数在一个 SWF 影片中加载外部的 SWF 影片。 由于三个模块都是独立的 Flash 影片，利用了此函数实现了它们间的相互 调用。 4 课件的总体设计 背景的设计 主色调的选择和搭配 课件用的比较多的是在教学方面，性质还是像课本一样，老师和 12 学生都要看着课本来教和学，多出来的功能就是交互性。 无论是老师和学生一直看着同一页内容看久了眼睛都会疲倦，而且人的情绪上也会觉得很乏味和烦躁。 这样的情况下主色调就不能采用暖色来填充了，因为暖色更容易让人产生烦躁的心情。 所以我主要采用冷色调搭配，比如蓝色、绿色、紫色等一些生命的颜色，还有一些稍微淡一点的冷色搭配在一起，这样看上去就不会那么单调、疲乏，反而会给人一种清新、活力，这 样可以起到缓解疲劳的作用。 背景图片的设计 课件的本质还是跟课本相似的，除了具有相当的实用性以外，最主要的是视觉效果。 用户在应用课件的时候除了文字以外，还会注意到背景的搭配。 所以图片的设计及色彩的搭配起到很大的作用。 首先图片风格的选定。 图片的风格不能过于卡通，这样给人的感觉很幼稚，主观上在威信方面会打折扣的；同时也不能像专业的宣传广告那样太注重商业价值的宣传；还不能太严肃，太死板，这样会给人一种距离感同样不能引起学生的兴趣。 综上所述，整体的风格要淡雅、清新、美观但不花哨，实用性强但不失兴趣的启发 因素。 另外风格要大体一致，但是又不能太相似，不然还是会起到重复，厌烦的效果。 在风格保持一致的同时要注意每个背景的个性设计。 根据课本的实际内容总共分为十二个章节，课件的实际是两个章节，除此以外另加上封面和封底。 素材的搜集 根据具体的需要我需要十八张背景图片，因为一共是十二章节，每一章节我采用的背景图片是不同的，如图 41 所示。 但每章节内的每个页面都是相同的背景图片。 封面我采用的是课件中用到频率比较 13 高的图片组成的，目录则是十二副小图片组成，每幅图片代表一个章节。 封面跟正文部分的背景风格还是不一样的，封面要 体现的是整个课件的风格，可以说是正文部分背景图片风格的整合，也就代表了整个课件的风格。 而其他正文部分的背景在保持大的风格上一致以外还要体现不同的个性。 图 41 主界面 图片的处理 首先图片的处理工具是 Fireworks,为 Fireworks 比较方便、简单、功能也比较多。 而且在各种平面处理工具中对 fireworks 是最熟悉，使用起来最顺手的。 图片的大小设置为 800*630，与 Flash 文档的大小相同。 14 封面的设计 封面的起到一个书面的作用，就像书的封面一样，在封面上可以了解到书名。 当然多媒体 课件的封面同样具有这样的功能，首先要介绍所要学习的科目，课件名等信息。 但是课件不会像翻书一样直接翻到下一页，而是要通过交互作用跳转到下一个页面 目录页面。 如图42 所示。 图 42 封面 封面 右 上 角放置了 三个按钮，用于跳转到目录页面、封面和结束 ，按钮的实现在以下的章节中都有所介绍。 目录布局的设计 目录造型的设计 多媒体课件的目录不会像书本的目录那么单调，除了文字就是符 15 号，如图 43 所示。 图 43 课件的目录 目录功能的设 计 目录的功能就是通过章节的名称可以找到对应的页码，很快就可以翻到对应的章节。 而多媒体课件的目录的功能是在点击按钮后就可以跳转到相应的章节了，然后进行教学。 首先十二个章节用了十二副图片按钮元件，每幅图片就是一个按钮。 按钮上加的控制代码是 on (release) { gotoAndPlay(xx)。 } 其中的 xx 是该场景内帧标签，方便跳转的实现。 每一章节都对就不同的帧标签，其中图层设计如图 44 所示。 16 图 44 目录场景的图层设计 图层 e1 存放的是代码 stop()， e2 层放的是按钮， e e5 放的是文字， e e7 放的是图片。 在封面上点击 Come in 按钮就可以进入目录页面，其中页面中按钮的具体代码在按钮的设计中详述。 页面的设计 普通页面效果的设计 以第 1 章的其中一个页面为例，其制作过程如下： 首先，新建一个名为“整数加法”的影片剪辑元件，在这个元件的编辑场景中，用绘图工具绘制一个 653 306 的黑色矩形。 将图层一命名为“文字”，选择 [文本工具 ]，在第一帧将文字输入。 制作遮罩动画，新建一个图层，命名为“横线一”，在第一帧，用绘图工具绘制一条直线，并将该帧命为帧标签“ a”。 再新建一个名为“横线一 0”的图层，在第一帧，绘制一个 的直线，遮住在“横线一”图层绘制的直线的最左端，在第十九帧，将该直线拉长，完全覆盖在“横线一”图层的直线。 选择第一帧，定义补间动画。 将该层设置为“遮罩层”，如图 45 所示。 “横线二”，“横线三”，“注释部分”等，制作方法类似，就不再重述。 17 图 45 多媒体课件入门 按钮的制作，新建一个按钮元件，在“图形”图层，用绘图工具，绘制一个颜色为“ CC00CC”的不规则圆形，新建一个名为“文字”的图层，在 [指针经过 ]帧，插入关键帧，用 [文本工具 ]输入“ a”。 返回到影片剪辑，将该按钮添加代码： on (release) { gotoAndPlay(a)。 }。 其余按钮的制作方法类似，就不再重述。 新建一个名为“代码”的图层，在第一帧添加代码 stop。 至此，此页面制作过完成。 习题页面效果的设计 习题页面主要由题目部分和参考答案部分组成，题目页面的制作 ，一共有四 18 道题目，因此需要制作四个页面，这里就以第一道题目的页面与参考答案页面为例进行介绍。 习题页面共有六个图层，命名如图 46 所示。 图 46 图层命名 题目部分页面的设计 第一道题目页面的制作方法，是在图层“习题 1”的第 65 帧到第 71 帧间创建补间动画，将第 65 帧命名为“ p0”，第 72 帧为“ p1”，在第 71 帧插 入 stop 动作。 然后，在图层“翻页”的第 71 帧处将按钮“元件 18”插入舞台的合适位置，代码为 on (release) { gotoAndPlay(p1)。 }，通过该按钮进入下道题，具体的图层设计如图 47 所示。 其中，单选题的“单选按钮”是从“组件”面板的“ User Interface”组件类别中选取的，它们的参数设置如图 48 所示，最终的效果图如图 49 所示。 19 图 47 图层设计 图 48 参数设置 图 49 第一章习题 最终效果 参考答案页面的设计 这张页面采用了滚动按钮，使显示内容上下移动，在较小空间里能看到更多的内 20 容。 效果图如图 410 所示。 图 410 参考答案效果图 操作步骤如下： 1. 将库中。