(Flash)课件-ch4

计算机基础与实训教材系列《中文版FlashCS3实训教程》第4章使用元件、实例与库学习目标丰富的媒体资源引用对作品生动性起到了关键性作用，作品中的各种媒体资源在库中要进行有效的管理，元件是在利用媒体时经常使用到的应用形式。本章介绍了元件、实例和库的相关操作及应用，重点掌握不同类型元件的使用及区别。本章重点元件和实例的概念元件的类型创建和编辑元件实例的编辑库的管理4.1元件与实例4.1.1相关概念元件是一种可以重复使用的对象，每个元件都有一个唯一的时间轴和舞台，以及几个图层。重复使用元件不会增加文件的大小，元件还简化了文档的编辑。当编辑元件时，该元件的所有实例都相应地更新。元件的另一个好处是使用它们可以创建完整的交互性。实例是对元件的引用。创建元件之后，可以在文档中任何地方（包括在其它元件内）引用该元件即创建该元件的实例。实例可以与它的元件在颜色、大小和功能上有差别。可以在属性面板中为实例提供名称，在ActionScript中使用实例名称来引用实例。4.1.2元件的类型元件共分为3种：图形、按钮和影片剪辑，如图4-1所示。1、图形：图形元件可用于静态图像，也可用来创建动画片断。它的时间轴和主时间轴同步。交互式控件在图形元件中不起作用。2、按钮：可以创建用于响应鼠标单击、滑过或其它动作的交互式按钮。可以定义与各种按钮状态关联的图形，然后将动作指定给按钮实例。3、影片剪辑：用来创建可重用的动画片段。影片剪辑拥有各自独立于主时间轴的时间轴。它们可以包含交互式控件、声音甚至其它影片剪辑实例。图4-1元件类型4.2元件的相关操作4.2.1创建元件可以通过舞台上选定的对象来创建元件，也可以创建一个空元件，然后在元件编辑模式下制作或导入内容。【例4-1】创建一个新的空元件有如下几种方法。(1)选择【插入】|【新建元件】。(2)单击“库”面板左下角的“新建元件”按钮。(3)从“库”面板右上角的【库面板】菜单中选择【新建元件】。在出现如图4-2所示的“创建新元件”对话框中，输入元件名称并选择类型，单击“确定”，Flash会将该元件添加到库中，并切换到元件编辑模式。在元件编辑模式下，元件的名称将出现在舞台左上角的上面，并由一个十字光标指示该元件的注册点。图4-2创建新元件将选定对象转换为元件，在舞台上选择一个或多个元素。请执行下列操作之一：1、选择【修改】|【转换为元件】。2、将选中元素拖到“库”面板上。3、单击右键，然后从快捷菜单中选择“转换为元件”。4、从键盘上敲转换为元件的快捷键【F8】键。在出现如图4-3所示的“转换为元件”对话框中，输入元件名称并选择类型。在注册网格中单击，以便放置元件的注册点。单击“确定”。Flash会将该元件添加到库中。舞台上选定的元素此时就变成了该元件的一个实例。图4-3转化为元件4.2.2编辑元件编辑元件时，Flash会更新文档中该元件的所有实例。可以使用“在当前位置编辑”命令在舞台上与其它对象一起进行编辑。其它对象以灰显方式出现，从而将它们和正在编辑的元件区别开来。正在编辑的元件的名称显示在舞台顶部的编辑栏内，位于当前场景名称的右侧。【例4-2】以下操作均可在当前位置编辑元件。(1)在舞台上双击该元件的一个实例。(2)在舞台上选择元件的一个实例，单击右键如图4-4所示，然后选择“在当前位置编辑”。(3)在舞台上选择该元件的一个实例，然后选择【编辑】|【在当前位置编辑】。图4-4在当前位置编辑也可以在舞台上选择该元件的一个实例，单击右键，然后选择“在新窗口中编辑”。在单独的窗口中编辑元件使您可以同时看到该元件和主时间轴。正在编辑的元件的名称会显示在舞台顶部的编辑栏内。使用元件编辑模式，可将窗口从舞台视图更改为只显示该元件的单独视图来编辑它。正在编辑的元件的名称会显示在舞台顶部的编辑栏内，位于当前场景名称的右侧。【例4-3】执行下列操作之一来选择元件。(1)双击“库”面板中的元件图标。(2)在舞台上选择该元件的一个实例，单击右键，然后从上下文菜单选择“编辑”。(3)在舞台上选择该元件的一个实例，然后选择【编辑】|【编辑元件】。(4)在“库”面板中选择该元件，然后从【库面板】菜单中选择【编辑】，或者右键单击“库”面板中的该元件，然后选择“编辑”。要退出元件编辑模式并返回到文档编辑状态，请执行下列操作之一：1．单击舞台顶部编辑栏左侧的“返回”按钮。2．选择【编辑】|【编辑文档】。3．单击舞台上方编辑栏内的场景名称。4．双击元件内容的外部。4.2.3元件上机练习【例4-4】创建“图形”元件——雪花。本实例通过“雪花”元件的创建，介绍了图形元件的创建方法。实例效果如图4-5所示：图4-5雪花元件操作步骤：(1)新建一个Flash文档，设置文档属性。直接在文档属性面板中设置，或者选择【修改】|【文档】命令，打开文档属性对话框进行设置，如图4-6所示。(2)选择【插入】|【新建元件】，新建图形类元件如图4-7所示。图4-6设置文档属性图4-7新建图形类元件(3)用直线工具绘制如图4-8所示形状。(4)选中所绘制的图形，使用任意变形工具，先将旋转中心点移至图形的底部如图4-9所示。(5)选择【窗口】|【变形】命令，调出变形面板如图4-10所示，在面板中输入旋转角度60度，然后单击“复制并应用”按钮5次使图形旋转一周即可。图4-8雪花的一瓣图4-9使用任意变形工具图4-10变形面板【例4-5】创建“影片剪辑”元件——飘落的雪花。本实例通过“飘落的雪花”元件的创建，介绍了影片简介元件的制作方法。实例效果如图4-11所示。图4-11雪花飘落【例4-6】创建“按钮”元件。按钮实际上是四帧的交互影片剪辑。当为元件选择按钮行为时，Flash会创建一个包含四帧的时间轴。前三帧显示按钮的三种可能状态；第四帧定义按钮的感应区域。时间轴实际上并不播放，它只是对指针运动和动作做出反应，跳转到相应的帧。按钮元件的时间轴上的每一帧都有一个特定的功能：第一帧是弹起状态，代表指针没有经过按钮时该按钮的状态。第二帧是指针经过状态，代表指针滑过按钮时该按钮的外观。第三帧是按下状态，代表单击按钮时该按钮的外观。第四帧是单击状态，定义响应鼠标单击的区域。此区域在SWF文件中是不可见的。【例4-7】开始按钮２。本实例是在【例4-6】的基础上添加“点击”帧，观察按钮响应区域的变化。操作步骤：(1)按【实例4-6】的作法先制作按钮的前三帧。(2)在时间轴中选择“按下”帧，插入空白关键帧，在舞台上绘制一个较大的矩形可以覆盖前一帧图形的大小，如图4-22所示。(3)选择【控制】|【测试影片】命令测试影片。在测试按钮的时候，按钮感应鼠标的区域明显变大。图4-22“点击”帧效果图【例4-8】隐形按钮。在创作作品的时候根据需要我们会用到隐形按钮。隐形按钮就是只制作了“单击”帧的按钮。这样的按钮在是不显示的。操作步骤：(1)新建一个Flash文档，创建一个“按钮”类型元件。(2)直接在时间轴中选择“按下”帧，插入空白关键帧，在舞台上绘制矩形如图4-23所示。图4-23“单击”帧效果图(3)将元件拖放到舞台上。可以看到在编辑窗口是淡蓝色显示的如图4-24所示。图4-24隐形按钮在场景舞台上的效果(4)选择【控制】|【测试影片】命令测试影片。我们会发现，SWF文件中不显示按钮，但是可以找到感应区域。图4-24隐形按钮在场景舞台上的效果【例4-9】区分“图形”元件和“影片剪辑”元件。通过该例理解影片剪辑类型和图形类型元件的区别：影片剪辑元件的时间轴独立于主时间轴，而图形元件的时间轴同步于主时间轴。图4-25复制元件图4-26修改元件类型为图形【例4-10】元件的嵌套。在制作元件的过程中我们会调用其它已经制作好的元件，也即元件的嵌套，最后显示的效果是内层各元件效果的复合。实例效果如图4-27所示：图4-27实例效果4.3实例的相关操作4.3.1为实例另外指定一个元件为实例另外指定一个元件，具体操作步骤如下：1．在舞台上选择实例，然后选择【窗口】|【属性】|【属性】。2．在属性面板中单击【交换】按钮，如图4-39所示。3．选择一个元件以替换当前分配给实例的元件。若要重制选定的元件，请单击“重制元件”，然后单击“确定”。图4-39为实例指定另一元件4.3.2改变实例的类型在作品制作过程中可以根据需要改变实例的类型。例如，如果一个图形实例想让它在播放的时候独立于主时间轴，则可以将该图形实例重新定义为影片剪辑实例。具体的方法：在舞台上选择实例，从属性面板的菜单中选择“图形”、“按钮”或“影片剪辑”，如图4-40所示。图4-40改变实例类型4.3.3改变颜色效果每个元件实例都各有独立于该元件的属性。可以更改实例的色调、透明度和亮度；重新定义实例的行为（例如，把图形更改为影片剪辑）；并可以设置动画在图形实例内的播放形式。也可以倾斜、旋转或缩放实例。实例属性的修改不会影响元件。另外，可以给影片剪辑或按钮实例命名，这样就可以使用ActionScript更改它的属性。在舞台上选择实例，然后选择【窗口】|【属性】|【属性】，如图4-41所示。图4-41修改实例属性2．从属性面板内的“颜色”菜单中选择以下选项之一：（1）亮度：调节图像的相对亮度或暗度，度量范围是从黑（-100%）到白（100%）。若要调整亮度，请单击此三角形并拖动滑块，或者在框中输入一个值。（2）色调：用相同的色相为实例着色。要设置色调百分比（从透明（0%）到完全饱和（100%）），请使用属性面板中的色调滑块。若要调整色调，请单击此三角形并拖动滑块，或者在框中输入一个值。若要选择颜色，请在各自的框中输入红、绿和蓝色的值；或者单击颜色控件，然后从“颜色选择器”中选择一种颜色。（3）Alpha：调节实例的透明度，调节范围是从透明（0%）到完全饱和（100%）。若要调整Alpha值，请单击此三角形并拖动滑块，或者在框中输入一个值。（4）高级：分别调节实例的红色、绿色、蓝色和透明度值。对于在位图这样的对象上创建和制作具有微妙色彩效果的动画，此选项非常有用。左侧的控件使您可以按指定的百分比降低颜色或透明度的值。右侧的控件使您可以按常数值降低或增大颜色或透明度的值。4.3.4分离实例要断开一个实例与一个元件之间的链接，并将该实例放入未组合形状和线条的集合中，可以“分离”该实例。在舞台上选择该实例，选择【修改】|【分离】，如图4-42所示。此操作将该实例分离成它的几个组件图形元素。图4-42分离实例4.3.5调用其他文档中的元件在制作作品的过程中，有时候我们会直接拿其它文档中已经制做好的元件来使用。例如：我们在制作文档1时用到文档2中的元件2。从“库”面板中直接切换到文档2，如图4-4３所示选中元件2，拖放到文档1的舞台上，此时该元件自动地保存到文档1的库中。图4-43调用其他文档的元件4.4库的管理4.4.1创建库元素创建库元素可以采用几种办法：1.选择【插入】|【新建元件】命令，创建的新元件会自动添加到库中。２．选择【文件】|【导入】命令，如图4-44所示。无论是直接导入到库还是导入到舞台，都会在库中创建该素材的库元素。３．打开“库”面板右上角的【库面板】菜单，选择要创建的不同类型的库元素。图4-44用导入创建库元素4.4.2位图的导入导入位图时，可以应用压缩和消除锯齿功能，将位图直接放置在AdobeFlashCS3Professional文档中，使用位图作为填充，在外部编辑器中编辑位图，将位图分离为像素并在AdobeRFlashRCS3Professional中对其进行编辑，或将位图转换为矢量图。Flash可以导入矢量图形、位图和图像序列，支持的文件类型有：GIF、JPEG、BMP、AI、PSD、DXF、PNG.、EMF、TGA、TIFF等。4.4.3声音文件的导入Flash中有两种声音类型：事件声音和音频流。事件声音必须完全下载后才能开始播放，除非明确停止，否则它将一直连续播放。音频流