flash cs5使用元件、实例和库.ppt共22页

1）选择【编辑】菜单中的【编辑元件】命令。 2）在舞台上的对象上单击鼠标右键，选择“编辑”命令。 3）在舞台上的对象上单击鼠标右键，选择“在当前位置编辑”命令。 4）在舞台上的对象上单击鼠标右键，选择“在新窗口中编辑”命令。 5）在库面板中选中元件，然后选择右上角【选项】菜单中的【编
辑】命令。 6）在库面板中元件上单击鼠标右键，选择“编辑”命令。
4.1.2 修改实例对元件的影响 如果修改实例，对元件又有哪些影响呢？我们可以通过以下实
例来验证一下。
1） 在FlashCS5中创建新文档， 单击【文件】菜单中的【导入】 命令，将“蝴蝶.jpg”导入至舞 台，并将其转换为图形元件。 在该文件的库面板中选中蝴蝶 元件，将此元件拖动到舞台上， 来回拖动两次使舞台上有两只 蝴蝶元件的实例。 2） 鼠标右击左上方的蝴蝶，在 弹出的快捷菜单中选择“任意 变形”命令，按下Shift键不放， 向外拖动蝴蝶4个角中的任何一 个将蝴蝶放大。将“蝴蝶”实 例放大之后，观察元件库中该 “蝴蝶”图形元件，形状没有 发生任何改变，如右图所示。
3）单击库面板中的“蝴蝶”影片 剪辑元件，然后拖动鼠标将“蝴蝶” 影片剪辑拖动到舞台上，形成单个 “蝴蝶”实例。 4)单击【文件】菜单中的【另存为】 命令，将文件保存到指定文件夹下， 并命名为“蝴蝶1.fla”，并单击 【文件】菜单中的【导出】子菜单 中的【导出影片】命令，在同一文 件夹下保存成文件“蝴蝶1.swf”， 产生只使用一次元件的Flash文件。 5）单击库面板中的“蝴蝶”影片 剪辑元件，然后拖动鼠标将“蝴蝶” 影片剪辑拖动到舞台上，形成多个 “蝴蝶”实例，如右图所示。 6）用同样方法，在同一文件夹下 生成文件“蝴蝶2.fla”和“蝴蝶 2.swf”。
2.实例的变形
如果我们要改变舞台中实例的形状，可以先选中对象，然后右 击鼠标，在弹出的快捷菜单中选择【任意变形】命令，实现对象 的缩放、扭曲、旋转等各种变形操作。关于工具箱中“任意变形 ”工具的用法在前面的章节中我们已经做了详细介绍，现在可以 试验一下实例变形效果，如下图所示。

2020/2/29
5
使用元件、实例和库资源
▪ 元件的概念与类型 ▪ 制作元件 ▪ 设置实例属性 ▪ 编辑元件与实例 ▪ 库面板
2020/2/29
6
使用元件、实例与库资源——制作元件
在Flash中，可以通过两种方式制作元件，分别为创建新元件与将对象转换 为元件，下面以制作图形元件为例，说明元件的两种制作方式。
创建新元件 创建新元件是指直接创建一个空白元件，然后自动进入元件编辑模式，
接着在元件中创建和编辑元件中的对象。 将对象转换为元件
将对象转换为元件是指将选定的对象转换为元件，对象可以为任何元素， 将对象转换为元件后，即可改变对象的属性。
制作按钮元件
按钮元件就是响应鼠标事件的元件，而响应鼠标事件的各种效果可以通 过自行设置来表现。
Flash动画设计与制作
——使用元件、实例和库资源
合肥工业大学计算机与信息学院 石雷
2020/2/29
1
使用元件、实例和库资源
▪ 元件的概念与类型 ▪ 制作元件 ▪ 设置实例属性 ▪ 编辑元件与实例 ▪ 库面板
2020/2/29
2
使用元件、实例和库资源
▪ 元件的概念与类型 ▪ 制作元件 ▪ 设置实例属性 ▪ 编辑元件与实例 ▪ 库面板
按钮元件
通过绘制与鼠标事件相对应的对象，按钮元件主要用于创建响应鼠标事件 的交互式按钮。鼠标事件包括鼠标触及与单击两种。将绘制的图形转换为按 钮元件，在播放影片时，当鼠标靠近图形时，光标就会变成小手状态，为按 钮元件添加脚本语言，即可实现影片的控制。
影片剪辑元件
影片剪辑元件是Flash中应用最为广泛的元件类型，可以将它自身理解成为 一个小动画。在影片剪辑元件中可以制作独立的影片，除了不能将元件置于 其自身内部之外，制作影片的方法与在场景中没有区别。

制作多媒体课件
制作演示文稿
使用Flash的图形和文本工具，可以创建各种演示文稿，如教学课件、产品展示等。通过设置每个元素的位置、大小 和颜色等属性，可以创建清晰、美观的演示文稿。
制作交互式元素
通过编写ActionScript脚本语言，可以实现多媒体课件中的各种交互式元素，如按钮、表单、测试题等。这些交互式 元素可以增强课件的互动性和参与性，提高学习效果。
制作场景
使用Flash的影片剪辑元件，可以创建游戏中的各种场景，如关卡、城市、森林等。这些 场景可以提供游戏的环境和背景，增加游戏的沉浸感和代入感。
制作游戏逻辑
通过编写ActionScript脚本语言，可以实现游戏的各种逻辑和规则，如生命值、得分、关 卡等。这些逻辑可以控制游戏的进程和难度，使游戏更加有趣和挑战性。
提高文件性能
重复使用的元件只会在Flash文件中导 入一次，减少文件大小，提高加载速 度。
如何使用库
创建元件
导入资源
在库面板中，可以通过“新建元件”命令 创建不同类型的元件，如图形、按钮、影 片剪辑等。
可以将外部图形、声音等资源导入到库中 ，方便重复使用。
使用元件
修改元件
将库中的元件拖拽到舞台中，即可在场景 中使用该元件。
库的概念
01
库是Flash中用于存储和组织重复 使用的图形、按钮、影片剪辑等 资源的容器。
02
库中的元件可以在多个场景和时 间轴中重复使用，减少文件大小 并提高工作效率。
库的用途
高效管理资源
方便修改和更新
将常用的图形、按钮等资源集中存储 在库中，方便管理和查找。
对库中的元件进行修改后，所有使用 该元件的地方都会自动更新，提高工 作效率。

10.选择图层【梦工厂】第30帧创建一个关键帧，并选择第20帧，在属性栏里设置元 件【色彩效果】下的【Alpha】值为0%，如图1-1-11，然后选择第20帧和第30帧中 间任何一帧，点击右键创建传统补间动画，并在第50帧插入帧。
第一章 Flash CS5简述
实训项目一 简单动画制作
简单动画项目作
使用“动作”面板
动作】面板使您可以创建和编辑对 象或帧的 ActionScript 代码。选择 帧、按钮或影片剪辑实例可以激活" 动作"面板。
第一章 Flash CS5简述
项目实训二 界面操作
使用“属性”检查器
使用"属性"检查器可以很容易地 访问舞台或时间轴上当前选定项 的最常用属性，从而简化了文档 的创建过程。
9. 点击【插入图层】 按钮，新建一个图层，命名为使用【梦工厂】，选择图层第20 帧点击右键创建一个空白关键帧，使用【文本工具】 输入文字“网络动画设计制作 梦工厂”，在属性栏里设置字体为“黑体”，大小为“40”，字距为2，色彩为白色， 并点击【修改】菜单栏下的【转化为元件】命令，将文字转化为图形元件，命名为 【梦工厂】。
3. 使用 【矩形工具】绘制一个宽度550像素，高度120像素的矩形，填充颜色值为 #990000，属性设置如图1-1-4
4.执行【文件】菜单【导入】\【导入到舞台】菜单命令，将光盘素材文件第1章 /adobe.jpg图片导入舞台，使用【选择工具】 （快捷键V）移动图片位置。
5. 点击【插入图层】 按钮，新建一个图层，命名为使用【flash】，选择图层第一帧， 使用【文本工具】 输入文字“flashcs5”，在属性栏里设置字体为“Swis721 Blk BT”，大小为“40”，字距为5，色彩为白色，放置如图所示位置。

从图中可以看出该工具栏提供了16个最常用的命令，它可以固定横放 在菜单栏的下面，也可以垂直固定在左右边框上，还可以浮动在屏幕 上。
1.2.4 绘图工具箱
使用Flash CS5进行动画创作，必须绘制各种图形和对象，这就必须 使用到各种绘图工具。绘图工具箱中包含了10多种绘图工具，用户可 以使用这些工具对图像或选定区进行操作。单击工作区右侧的工具箱 缩略图标，即可展开工具箱面板，如图所示。
Flash CS5为了方便用户的使用，将一些使用频率比较高的菜单命令 以图形按钮的形式放在一起，组成了工具栏，如图所示。工具栏中的 按钮可用来快速开始一个新的项目，用户只需单击工具栏上的按钮， 就可以执行该按钮所代表的操作。
通过执行“窗口”/“工具栏”/“主工具栏”命令，可以在Flash CS5的 工作界面显示或隐藏工具栏。
1.2.1 标题栏
标题栏在整个屏幕的最上方。与以往版本相比，Flash CS5对界面进 行了优化，把菜单栏与标题栏合在一起，使得界面整体感觉更为人性 化，工作区域进一步扩大。窗口栏的右侧新增的搜索栏，可以使用户 很方便地搜索到官网上有关的帮助信息。
在Flash CS5中，工作区预设外观模式增加到了七种（动画、传统、 调试、设计人员、开发人员、基本功能、小屏幕），方便不同的用户 群的喜好选择。单击标题栏右上角的“基本功能”按钮，可以快速更 换工作区外观模式。
1.2.5 时间轴
Flash CS5的时间轴窗口默认情况下位于工作区的下方，它是处理帧 和层的地方，而帧和层则是动画的主要组成部分。当选择某一层，然 后在舞台上绘制内容或者将内容导入到舞台中时，该内容将成为这个 层的一部分，因为它是当前所选的内容。时间线上的帧可根据时间改 变内容。舞台中所出现的每一帧的内容表示该时间点上出现在各层上 的所有内容的反映。可以移动、添加、改变和删除不同帧的各层上的 内容以创建运动和动画。在时间线上使用多层层叠技术可将不同内容 放置在不同层，从而创建一种有层次感的动画效果。

第十二页，编辑于星期五：十三点 四十九分。
我们可以在按钮编辑模式中设置按钮的4种 不同状态，然后将做好的按钮拖入主场景 图形元件主要用于定义静态的对象。
第八页，编辑于星期五：十三点 四十九分。 第十四页，编辑于星期五：十三点 四十九分。
中即可。如果需要还可以为按钮设置动 单击库面板右上角的播放按钮，可以预览元件中的内容。
☻将已有动画转换为影片 剪辑元件。
●练习做一个影片剪辑元 件卡通猫
第十一页，编辑于星期五：十三点 四十九分。
4.4 按钮元件
它可以根据鼠标的不同状态（比如单击、鼠 标经过）显示不同的画面。添加了脚本程序 的按钮可以响应用户对影片的操作。
按钮实际上是一个只有4帧的交互影片剪辑， 当鼠标移到按钮之上或单击按钮时，即可产 生交互，按钮会随时改变它的外观。
第七页，编辑于星期五：十三点 四十九分。
落花效果
眼镜蛇的创建
主要练习图形元件创 建的两种方法以及利用 元件创建动画的方法和 注意事项。
第八页，编辑于星期五：十三点 四十九分。
元件的复制 元件的修改
第九页，编辑于星期五：十三点 四十九分。
4.3 影片剪辑元件
定义：基本上是一个小的独立电影，可以包含交互 式控件、声音甚至其他影片剪辑元件。所以影片剪 辑元件是flash中最具交互性、用途最多、功能最强 的部分。
第四章 Flash元件、实例 和库资源
第一页，编辑于星期五：十三点 四十九分。
本节课主要内容
图形元件 影片剪辑元件 按钮元件
第二页，编辑于星期五：十三点 四十九分。
4.1 元件的定义
元件定义：是在flash中创建的图形、按钮和 影片剪辑，是flash动画设计最基本、最重要 的元素。

和透明效果
在舞台中选中实例，在“属性”面板中的“色彩效果”选项组的 “样式”选项的下拉列表中，应用其中的选项可以改变实例的颜色和透 明效果。
“属性”面板
6.2.6 分离实例
选中实例，选择“修改 > 分离”命令，或按Ctrl+B组合键，将实例 分离为图形，即填充色和线条的组合，选择“颜料桶”工具，设置不同 的填充颜色，改变图形的填充色。
创建按钮元件过程
6.1.5 创建影片剪辑元件
选择“插入 > 新建元件”命令，弹出“创建新元件”对话框，在“名称” 选项的文本框中输入“变形动画”，在“类型”选项的下拉列表中选择“影片 剪辑”选项，单击“确定”按钮，创建一个新的影片剪辑元件“变形动画”。 影片剪辑元件的名称出现在舞台的左上方，舞台切换到了影片剪辑元件“变形 动画”的窗口，窗口中间出现十字，代表影片剪辑元件的中心定位点。在“库” 面板中显示出影片剪辑元件。
选中“库”面板中的影片剪辑元件“鱼”，将其拖曳到场景中， 场景中的鱼图形就是影片剪辑元件“鱼”的实例。
6.2.3 转换实例的类型
每个实例最初的类型，都是延续了其对应元件的类型。可以将实例的 类型进行转换。在舞台上选择图形实例，在“属性”面板的左上方，选 择“元件行为”选项下拉列表中的“影片剪辑”，图形“属性”面板转 换为影片剪辑“属性”面板，实例类型从图形转换为影片剪辑。
第6章 元件和库
本章简介：
在Flash CS5中，元件起着 举足轻重的作用。通过重复应 用元件，可以提高工作效率、 减少文件量。本章讲解了元件 的创建、编辑、应用，以及库 面板的使用方法。读者通过学 习要了解并掌握如何应用元件 的相互嵌套及重复应用来制作 出变化无穷的动画效果。
课堂学习目标
元件与库面板 实例的创建与应用

制作动态文本
• 制作按钮：新建元件，类型:按钮，命名为:文字发散按钮 • 层1（按钮底图）：圆角矩形 • 层2（按钮文本）：
• 弹起帧：输入白色文本―播放”，转化为mc元件命名为“基础文本播放” • 在指针在上帧和按下帧中：插入关键帧 • 新建mc元件：发散文字
• 层1（底图文字）：拖入―基础文本播放”mc，在25帧处插入普通帧
• function Play_fn(e:MouseEvent):void { play();} //点击Play按钮要做的动作
• function Stop_fn (e:MouseEvent):void { stop();} //点击Stop按钮要做的动作 • //Play按钮实例名：Play_btn,Stop按钮实例名：Stop_btn •//为鼠标点击按钮注册侦听器,侦听器传递函数名：Play_fn和 Stop_fn;
• 层1（底图文字）：拖入―基础文本播放”mc，在25帧处插入普通帧
• 层2（右发散）：复制层1，将第一帧拖到第10帧处，在第25帧处插入关键帧，将第25帧 中的文字拖到右上角，并设置alpha为0，建立10—25帧的补间动画 • 层3（左发散）：复制层2，将第25帧中的文字拖到左下角，建立10—25帧的补间动画 • 用“发散文字mc‖替换“指针在上帧”中的元件 • 打散“按下帧”中的元件，改成文本“谢谢”
• 在Play按钮元件上加上动作：on(release){play();} • 在Stop按钮元件上加上动作：on(release){stop();} //控制主时间轴的播放
• 测试影片 • 可以再加两个按钮，控制帆船元件时间轴的播放：
• 在boat_Play按钮上加上动作：on(release){ boat_mc.play();}//控制帆船的时间轴的播 放 • 在boat_Stop按钮上加上动作：on(release){boat_mc.stop();}