当前位置：文档之家 › Flash课件制作实例

Flash课件制作实例

  • 格式：doc
  • 大小：4.11 MB
  • 文档页数：13

常规教学中基础图形的动画制作

项目一：Flash简介

目标：

1、认识flash软件

2、了解flash的界面构成

一、认识Flash

FLASH是Macromedia公司推出的一种优秀的矢量动画编辑软件，FLASH8.0是其最新的版本。利用该软件制作的动画尺寸要比位图动画文件﹙如GLF动画﹚尺寸小的多，用户不但可以在动画中加入声音，视频和位图图像，还可以制作交互式的影片或者具有完备功能的网站。通过简介的学习，大家应熟悉FLASH动画的特点，FLASH8.0的界面组成元素。

二、什么是 Flash

Flash 是一种创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常，使用 Flash 创作的各个内容单元称为应用程序，即使它们可能只是很简单的动画。您可以通过添加图片、声音、视频和特殊效果，构建包含丰富媒体的 Flash 应用程序。

Flash 特别适用于创建通过 Internet 提供的内容，因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。

要在 Flash 中构建应用程序，可以使用 Flash 绘图工具创建图形，并将其它媒体元素导入 Flash 文档。接下来，定义如何以及何时使用各个元素来创建设想中的应用程序。

在 Flash 中创作内容时，需要在 Flash 文档文件中工作。Flash 文档的文件扩展名为 .fla (FLA)。Flash 文档有四个主要部分：

舞台是在回放过程中显示图形、视频、按钮等内容的位置。 时间轴用来通知 Flash 显示图形和其它项目元素的时间，也可以使用时间轴指定舞台上各图形的分层顺序。位于较高图层中的图形显示在较低图层中的图形的上方。

库面板是 Flash 显示 Flash 文档中的媒体元素列表的位置。如上图所示 舞台 时间轴

库面板

动作面板

ActionScript

代码

Action Script

代码可用来向文档中的媒体元素添加交互式内容。例如，可以添加代码以便用户在单击某按钮时显示一幅新图像，还可以使用 Action Script 向应用程序添加逻辑。逻辑使应用程序能够根据用户的操作和其它情况采取不同的工作方式。Flash 包括两个版本的 Action Script，可满足创作者的不同具体需要。

Flash 包含了许多种功能，如预置的拖放用户界面组件，可以轻松地将 Action Script 添加到文档的内置行为，以及可以添加到媒体对象的特殊效果。这些功能使 Flash 不仅功能强大，而且易于使用。

完成 Flash 文档的创作后，可以使用【文件】|【发布】命令发布它，快捷键SHIFT+F12。这会创建文件的一个压缩版本，其扩展名为 .swf (SWF)。然后，就可以使用 Flash Player 在 Web 浏览器中播放 SWF 文件，或者将其作为独立的应用程序进行播放

项目二：抛物线课件

目标：

1、掌握新建影片的方法

2、学会基本形状的绘制方法

3、会使用任意变形工具

4、掌握对齐工具的使用方法

课件效果

运行课件，界面上有课件标题、坐标轴、抛物线和抛物线公式，效果如图 2-1 所示。

图 2-1 课件运行效果

操作步骤 ：

一、 新建影片文档

运行 Flash 8 ，选择【文件】 | 【新建】命令或按快捷键 Ctrl+N ，在弹出的【新建文档】窗口中，选择【新建 Flash

文档】，单击【确定】按钮新建一个影片文档。 ActionScript代码设计窗按 Ctrl+J 打开文档属性对话框，参数如图 2-2 所示，选择【文件】 | 【保存】命令将文件保存为“抛物线 .fla ”。

图 2-2 设置影片文档属性

二、绘制坐标轴

1、设置视图网格。选择【视图】 | 【网格】 | 【编辑网格】命令，在弹出的【网格】对话框中，选中【显示网格】和【对齐网格】选项，其它参数保持不变，单击【确定】按钮，如图 3 所示。

图 3 【网格】对话框

2、绘制 x 轴。选择工具箱中的线条【线条工具】，在【属性】面板中，设置粗细为“ 2 ”，【填充色】为黑色，在场景中画一条水平线作为 x 轴。

知识链接：

用线条工具绘制时按住 Shift 键可以画出垂直、水平和 45 度方向的直线；用椭圆工具绘制时按住 Shift 键可以画出正圆；用铅笔工具绘制时按住 Shift 键可以轻松画出正交直线。

再用【线条工具】画一个三角形，填充色为黑色，用【箭头工具】选中三角形的边线，将其删除。选择工具箱中的【任意变形工具】，单击【选项】里的【缩放工具】，将其缩小到合适程度。把三角形拖放到直线右边作为坐标轴的箭头，按 Ctrl+G

键，将直线和三角形组合。

知识链接：

按住 Shift 键可以同时选中多个对象。

画一组直线作为数轴的刻度，选中刻度，用【缩放工具】 将其缩小到合适程度。选中轴和刻度，选择【窗口】 | 【对齐】命令打开【对齐面板】，如图 2-4 所示。

图 2-4 对齐面板 在【对齐面板】上单击【水平居中】按钮和【垂直居中】按钮，选中所有图形按 Ctrl+G 组合，完成效果如图 2-5

所示。

图 2-5 完成的 x 轴

知识链接：

在工具箱中我们可以利用任意变形工具直接对图形进行缩放、旋转等操作。但如果缩放、旋转要求精确的话，我们就可以在变形面板中进行设置。

3、绘制 y 轴。选中 x 轴，选择【编辑】 | 【复制】命令或按 Ctrl+C 键，复制 x 轴，再选择【编辑】 | 【粘帖到中心位置】命令或按 Ctrl+V 键粘帖。

知识链接：

按住 Ctrl 键，用鼠标拖动图形，可以快速复制原图形。

选择【修改】 | 【变形】 | 【逆时针旋转 90 度】命令，得到 y 轴，用【箭头工具】调整好位置，完成后效果如图 2-6 所示。

图 2-6 完成后的坐标轴

知识链接：

选择【窗口】 | 【变形】命令，选中图形，在【变形面板】中设置需要旋转的角度，按【复制并应用变形】按钮，可以精确的复制出若干旋转角度相同的图形。

三、绘制抛物线

用【线条工具】在 y 轴的上半轴画一条水平直线，将鼠标放在直线上，当光标变成圆弧形时拖动鼠标，将直线调整成为一条曲线，并使曲线最低点位于坐标原点。完成效果如图 2-7

所示。

图 2-7 完成的坐标

知识链接：

直线与 y 轴的交叉点，一定要是直线的中心点，绘制出的抛物线才以 y 轴为对称轴。

四、输入文字

选择【文本工具】 , 设置文本参数如图 2-8 所示，为坐标轴输入标注。

图 2-8 设置文本参数 用同样的方法输入课件标题、公式。

五、测试并保存文档

选择【控制】 | 【测试影片】命令，或按快捷键 Ctrl+Enter 测试课件。完成后，按 Ctrl+S 将课件保存。

案例总结：

这一例我们通过绘制一个简单的抛物线来掌握 Flash 8 中部分绘图工具的使用方法，熟悉对齐面板和变形面板的操作以及辅助工具的应用。在制作课件过程中，制作方法不是一层不变的，我们可以通过不同的方法达到同样的效果，这就要求在练习过程中不断的摸索，找出最捷径、最行之有效的办法。

项目三：荷塘月色

目标：

1、掌握导入位图的方法

2、掌握在 Flash 中位图的处理方法

3、会使用套索工具

4、掌握任意变形工具中的封套

本实例是表现中学语文课文《荷塘月色》的一个图形课件，这个课件的制作充分应用了 Flash 位图和矢量图的处理能力，通过图形、图像将《荷塘月色》的课文意境表现了出来，利用这个课件辅助教学，不但使学生直观地感受到作者在课文中描写的情景，而且给学生带来美的感受。如图 3-1 所示是课件运行的效果。

图 3-1 课件运行效果

制作步骤

一、创建影片和导入位图

1、新建影片文档。选择【文件】 | 【新建】命令或按快捷键 Ctrl+N ，新建一个 Flash 影片文档，设置舞台尺寸为 660 × 480 ，其它参数保持默认值。

2、导入位图。选择【文件】 | 【导入】命令，弹出【导入】对话框，在对话框中选择所需要的图片文件，单击【打开】按钮，导入课件所需的荷花图像文件，如图 3-2 所示。

图 3-2 导入位图

知识链接：

在 【导入】对话框中，按下 Ctrl 键，依次单击图像文件，可同时选中要导入的多个图像文件。

导入到文档中的图像会自动分布在场景的舞台上，按 Delete 键，将场景中的图像文件全部删除，此时图像文件已经保存在【库】中。打开【库】面板可以看到导入的位图对象，如图 3-3 所示。

图 3-3 【库】面板中的位图

知识链接：

导入的位图在【库】面板中的名称就是图像的文件名，它们的【种类】标识为【位图】，注意观察它们的图标，它们具有独特的图标，和其他类型的对象的图标不一样。【库】面板中的这些位图对象也象图形元件一样，你可以随时将它们拖放到场景中使用。

二、去掉位图的背景

我们导入到 Flash 中的位图往往有背景，这对课件效果有很大的影响，也不利于课件整体风格的设计，可以想象，漂亮的图像下面有一块白色或黑色的背景将多么难看。下面我们就讨论一下在 Flash 中如何去掉图像的背景。

1、分离位图。新建“荷花 1 ”图形元件，在【库】面板中单击“荷花 1 ”图像名称，选中荷花图像，将图像拖到场景中央，如图 3-4 所示。

图 3-4 拖放【库】面板中的位图对象

此时，我们对荷花图像无法进行修改，因为 Flash 将导入的图像作为单个的对象处理，要进行编辑修改，必须将位图分离。

选择【修改】 | 【分离】命令，或按快捷键 Ctrl+B 将荷花位图图像分离，如图 3-5 所示。

图 3-5 分离位图

2、擦除背景。选择工具箱中的【索套工具】 ，在工具箱的下端，单击【选项】中的【魔术棒属性】按钮 ，弹出【魔术棒设置】对话框，在【阈值】中输入“ 20 ”，在【平滑】下拉菜单中选择【平滑】选项，如图 3-6 所示。

合集下载

Flash课件制作教程(3)

Flash课件制作教程(3)

本教程选自《跟着案例学Flash CS5课件制作》，一书，如需全部教程，请购买该书：

读者服务QQ群号：4764513

作者QQ：467616065

读者服务博客：/blog/user1/2852/index.html

读者服务微博：/u/2627673007

4.1.2 陆地板块的张裂

这是一个高中地理课件，有3个陆地板块，原本是合在一起的，当左右两个板块向两边张裂时，中间的板块就会下沉，图4-8是课件的动画示意图。

和前一个实例相比，这个动画要稍微复杂一些，因为左板块、中板块和右板块在同时变化。就像复杂的图案可以分解成多个简单图案一样，这种复杂的动画也是可以分解成几个简单动画的，而且也必须要分解成几个动画。分解的方法是把不同的动画制作到不同的图层中去，对每个图层来说制作的动画并不复杂，但合在一起就可以表现出比较复杂的效果了。

图4-8 课件示意图

制作步骤：

1.绘制左边的板块

（1）新建Flash文件，保持文档的默认属性值不变，保存文件。

（2）把“图层1”重命名为“左板块”，用 “矩形工具”绘制一个笔触颜色是黑色，填充颜色是暗黄色的正方形，在“属性”面板中把正方形的宽和高都设为140像素，x值为135，y值为130，然后把正方形的右上角的顶点往左拖，成为一个直角梯形，如图4-9所示。

图4-9 绘制一个直角梯形 图4-10 在第40帧插入关键帧

2.制作左边板块张裂的动画

（1）在“左板块”图层第40帧上单击右键，在右键菜单中选择“插入关键帧”命令，第40帧被插入关键帧，第2帧至第39帧则是普通帧，如图4-10所示。

现在观察播放头，播放头在第40帧，而舞台上显示的还是第1帧绘制的直角梯形，这个直角梯形并不是绘制的，它来自哪里呢？来自第1帧。第40帧与第1帧完全一样。

专家点拨：在某一帧插入关键帧时，这个关键帧完全复制了其前面关键帧的内容。

（2）继续让播放头停在第40帧，选中舞台上的直角梯形，在“属性”面板中把其宽度减少为120像素，其他的属性值保持不变。

flash制作雪花飞舞实例步骤

flash制作雪花飞舞实例步骤

复制影片剪辑函数的使用：雪花飞舞

1、 新建一个actionscript2.0的flash文件，大小为800*600，背景颜色为黑色；

2、 导入素材“雪景.jpg”；

3、 新建图形元件“pic1”，制作雪花。利用椭圆工具和变形面板制作雪花，并填充颜色为放射性（旋转60）

4、 新建影片剪辑元件mc1，把pic1图形元件拖到舞台上，并在第三帧处，插入帧；新建图层2，在第一帧处输入脚本；在第三帧处也输入脚本。

第1帧脚本：

x = random(800);

y = random(600);

z = Number(random(50)) + 50;

yvel = z;

xvel = z * (random(200) - 100) / 100;

zvel = z * (random(200) - 100) / 100;

第3帧脚本：

_x = x;

_y = y;

_alpha = z;

dy = yvel / 10;

y = Number(y) + Number(dy);

if (Number(y) >= 600) {

y -= 600;

}

dx = xvel / 10; x = Number(x) + Number(dx); if (Number(x) >= 800) {

x -= 800;

}

if (Number(x) < 0) {

x = Number(x) + 800;

}

dz = zvel / 10;

z = Number(z) + Number(dz);

if (100 < Number(z)) {

z = 100;

}

if (Number(z) < 50) {

z = 50;

}

yvel = z;

xvel = Number(xvel) + Number((random(20) - 10));

if (100 < Number(xvel)) {

xvel = 100;

校本教材FLASH制作实例

校本教材FLASH制作实例

Flash动画制作

- 1 -

临沂第二十中学 校本课程------Flash动画制作

之二 Flash动画制作

- 2 - 字母飘散效果

启动Flash软件，用文本工具输入I love you，在属性栏选择文本类型为静态文本并调整字母之间的距离，如图13-1所示。

图13-1

执行【修改】菜单下的【分解组件】命令将字母拆散，如图13-2所示。

图13-2

再次执行【修改】菜单下的【分解组件】命令将每个字母打散，如图13-3所示。

图13-3 Flash动画制作

- 3 - 母分散到到不同的图层上，当然我们这里不需要一层一层地新建，执行【修改】菜单下的【分配到层】命令，如图13-4命令。

图13-4

这时我们看到已经已经新建了许多图层并将图层1上面的字母取出来放在了不同的层上面，此时图层1已经成为空白。选择图层1后点击鼠标右键，在弹出的菜单中将它删除或者直接点击图13-4所示的垃圾桶工具来删除。将每个图层上的字母都转换成图形元件并在25帧处分别插入关键帧，如图13-5所示。

图13-5

分别调整最后一帧图形元件的位置并创建动画,创建动画时将个别字母在移动过程中让它旋转（在属性栏设置），如图13-6所示。 Flash动画制作

- 4 - 图13-6

预览一下我们看到文字像氢气球般飘散走了。

说明：

我们第一次执行“分解组件”命令的作用是将字母拆散开，第二次执行“分解组件”的作用是将每个字母由文字状态变成形状。因为如果我们使用了特殊字体（比如我们自己安装的字体），而其它电脑没有安装这种字体的话就会被宋体或其它字体所替代，所以为了保证每台电脑都能正常显示出我们需要效果的话，就必须将文字打散使其以形状的方式显示。如果使用的是宋体等常用字体的话就不需要这样做，因为每个系统在安装时都带有常用字体。

Flash动画制作

- 5 - 文字摆动出现效果

用和第一节一样的方法我们再来制作一种文字摆动出现效果。启动Flash软件，和上一节步骤一样，用文本工具输入FLASH，执行一次“分解组件”命令（当然再执行一次将它彻底打散也可以），把它们分配到每个层后将每个字母都转换成图形元件，如图13-7所示。

FLASH动画制作实例

FLASH动画制作实例

FLASH动画制作实例

一、 综合实例（MTV制作步骤）

1. 作MTV序幕

（1） 新建一个文件，将场景背景设置为黑色（“修改”—“文档”—“背景颜色”）。

（2） 选择“文件”—“导入”—“导入到舞台”命令，将01.jpg导入到场景中，并让其覆盖场景，最后在第300帧处按F5插入帧。

（3） 创建一个名为“直线”的图形元件（“插入”—“新建元件”），在元件编辑场景中绘制一条长为300的蓝色直线，见图7.1。

（4） 回到场景中，新建一个名为“线1”的图层，将元件“直线”拖放到场景中，并放到场景外左边，在第25帧处插入关键帧（F6），将直线向右移动，使直线在左边与背景的左边缘对齐。然后在第1帧和25帧之间创建补间动画（右击第一帧—“创建补间动画”），并将第25帧的状态沿用到第300帧。

（5）新建一个名为“线2”的图层，在第25帧插入关键帧，将元件“直线”拖放到场景中，将其旋转90度（“修改”—“变形”）并放到场景外的上方，在第50帧处插入关键帧，将直线向下移动，使直线的上边与背景的上边缘对齐，然后在第25帧和第50帧之间创建补间动画，并将第50帧的状态沿用到第300帧。

（6）创建一个名为“黄”的图形元件，在元件编辑窗口中输入“黄字”，设为“华文隶书、96、黄色”。

（7）回到场景中，新建一个名为“黄”的图层，在第51帧处插入关键帧，将图形元件

“黄”拖放到背景外的左边，在第62帧处插入关键帧，将“黄”拖放到横线和竖线交叉的左方，然后在第51帧和第61帧之间创建补间动画，并将第61帧的状态沿用到第300帧。

（8）创建一个名为“昏”的图层，用类似的方法在第62-73帧之间创建“昏”字从上到下运动的动画。

步骤（4）-（8）效果见7.2。

（9）新建一个图层名为“鸟”，在第73帧处插入关键帧，选择‘文件“/“打开外部库”，在出现的对话框中选择02.fla，打开02的库面板。

（10）将影片剪辑元件“鸟飞”拖入场景最右下角的天空处，在第250帧处插入关键帧，图7. 1 绘制直线图形元件