第6章元件、实例和库元件实例库本章主要内容:6.1元件6.1.1元件的类型6.1.2创建元件层6.1.3编辑元件6.1.4实战范例——制作按钮元件Flash的元件有3种类型:影片剪辑(即MovieClip,简称为MC)图片(即Graphic)按钮(Button)。6.1.1元件的类型6.1.1元件的类型1.影片剪辑影片剪辑实际上是可重复使用的动画片段,其拥有相对于主时间轴独立的时间轴,也拥有相对于舞台的主坐标系独立的坐标系。它是一个容器,可以包含一切素材,如用于交互的按钮、声音、图片和图形等,甚至可以是其他的影片剪辑。同时,在影片剪辑中也可以添加动作脚本来实现交互和复杂的动画操作。通过对影片剪辑添加滤镜或设置混合模式,可以创建各种复杂的效果。在影片剪辑中,动画是可以自动循环播放,当然也可以用脚本来进行控制。6.1.1元件的类型2.按钮按钮用于在动画中实现交互,有时也可以使用它来实现某些特殊的动画效果。一个按钮元件有4种状态,它们是弹起、指针经过、按下和点击,每种状态可以通过图形或影片剪辑来定义,同时可以为其添加声音。在动画中一旦创建了按钮,就可以通过ActionScript脚本来为其添加交互动作。6.1.1元件的类型3.图形图形是元件的一种最原始的形式,其与影片剪辑相类似,可以放置其他元件和各种素材。图形元件也有自己的独立的时间轴,可以创建动画,但其不具有交互性,无法像影片剪辑那样添加滤镜效果和声音。6.1.2创建元件在Flash中,创建元件实际上是利用元件自身的时间轴进行动画创作的过程。要创建元件,一般有两种方法,一种方法是将舞台上的选定对象转换为元件。另一种方法是创建一个空白元件,然后绘制或导入需要的对象。1.转换为元件在舞台上绘制或导入对象后,可以将其转换为对象。在舞台上选中对象,选择【修改】|【转换为元件】命令(或按【F8】键)。此时将打开【转换为元件】对话框,在【名称】文本框中输入元件名称。在【类型】下拉列表中选择元件类型,如这里选择【图形】将其转换为图形元件。6.1.2创建元件6.1.2创建元件2.新建元件选择【插入】|【新建元件】命令(或按【Ctrl+F8】键将打开【创建新元件】对话框,在其中设置元件名称和元件类型后,单击【确定】按钮,Flash会将元件添加到库中,同时打开该元件的编辑窗口,在该窗口中即可直接创建需要的元件内容。1.在当前位置编辑元件在舞台上双击元件实例即可进入元件的编辑模式,此时其他对象呈灰色显示,处于不可编辑状态。同时,正在编辑的元件的元件名显示在舞台上方。用户此时对元件进行编辑,完成编辑后,单击窗口上的“返回”按钮或在窗口的空白处双击,即可退出当前元件编辑状态。6.1.3编辑元件6.1.3编辑元件2.在新窗口中编辑元件在新窗口中编辑元件是指在一个单独的窗口中对元件进行编辑,此时在窗口中将只能看到被编辑元件的内容和时间轴,舞台上其他对象都看不到。在舞台上鼠标右击需要编辑的元件,在关联菜单中选择【在新窗口中编辑】命令(或在【库】面板中双击需要编辑的元件)即可进入元件编辑状态。完成编辑后,关闭该窗口即可。6.1.4实战范例——制作按钮元件1.范例简介本例介绍按钮元件的制作方法。在程序运行时,按钮有4种状态,这4种状态是由时间轴上的4个帧来体现的,本例将只制作按钮元件的3种状态,它们分别是按钮的弹起、指针移过和按下状态,这3种状态通过显示不同的颜色来区分。为了简化制作,这里按钮按下状态和点击状态使用相同的效果图。通过本例的制作,读者将掌握按钮的制作思路以及元件的创建和编辑的知识,同时将进一步熟悉图形的绘制和对图形应用渐变效果来创建特效的技巧。2.制作步骤:略。请参看教材或者观看配盘上的视频教程。6.2实例6.2.3按钮实例6.2.2影片剪辑实例6.2.1图形实例6.2.4改变实例6.2.5实战范例——诗配画6.2.1图形实例1.【属性】面板简介图形元件一般包括静态的图形对象或是与影片的主时间轴同步的动画。将图形元件放置到舞台上,选择该实例后,可以在【属性】面板中对实例进行设置。在创建元件后,在文档的任何位置使用该元件就可以得到元件的实例,如将元件拖放到舞台上,舞台上就增加了该元件的一个实例。可以对实例进行任意的缩放和添加滤镜等操作,这些操作都不会对元件本身产生任何影响。当对元件进行修改后,Flash会更新该元件的所有实例。6.2.1图形实例2.改变实例色彩每个元件都有自己的色彩效果,要想在实际应用中改变这个效果,可以在【属性】面板的【色彩效果】栏用于改变实例的色彩效果。在该栏中,【样式】下拉列表包含【无】、【亮度】、【色调】、【高级】和【Alpha】这5个选项,在下拉列表中选择相应的设置项,即可对实例进行设置。6.2.1图形实例3.循环【循环】栏是图形实例的一个独有设置栏,其用于设置实例跟随动画同时播放的方式。在【选项】下拉列表中选择相应的选项即可进行设置。【循环】:选择该选项,实例跟随动画同时进行循环播放自身动画,在【第一帧】文本框中输入动画开始的帧。【播放一次】:选择该选项,从指定帧开始播放动画序列,播放完后动画停止。在【第一帧】文本框中输入指定帧的帧数。【单帧】:显示动画序列中的某一帧,在【第一帧】文本框中输入需要显示的帧的帧数。6.2.2影片剪辑实例将创建的影片剪辑拖放到舞台上或其他的元件内即可获得该影片剪辑的一个实例。影片剪辑拥有自己的独立的时间轴,其播放与主时间轴的播放没有关系。影片剪辑也是一种对象,在【属性】面板中可以对其属性进行设置。与图形实例相比,影片剪辑实例在【属性】面板中同样可以设置位置和大小和色彩效果等,但不同的是其可以添加滤镜效果和应用混合模式。6.2.2影片剪辑实例1.实例名称在Flash中,影片剪辑是一种对象,其可以通过ActionScript来进行调用。为了实现这种调用,需要给予影片剪辑一个可以识别的名称,这个名称并不是该元件在【库】面板列表中的名称。在【属性】面板的【实例名称】文本框中输入名称,即可为影片剪辑命名。6.2.2影片剪辑实例2.设置实例的混合模式对于影片剪辑来说可以像Photoshop那样处理对象之间的混合模式,通过混合模式的设置来创建复合图像效果。所谓的复合,是改变2个或多个重叠图像的透明度或颜色关系的过程,通过复合可以混合重叠影片剪辑中的颜色,从而创造独特的视觉效果。6.2.3按钮实例按钮实际上是一个有4帧的影片剪辑,这4个帧对应按钮的4种不同的状态。按钮实例的时间轴不能播放,但可以感知用户鼠标的动作,并根据鼠标动作来触发对应的事件。要设置按钮实例的属性,可以在其【属性】面板中进行。6.2.4改变实例对于创建的实例,用户可以在【属性】面板中对其进行设置,这里除了可以更改实例的色彩、大小和添加滤镜等操作之外,还可以改变实例的类型和交换实例。同时,实例也可以被分离以便于对其进行编辑修改。1.改变实例的类型2.交换实例3.分离实例6.2.5实战范例——诗配画1.范例简介本例介绍为国画添加古诗的过程。在本例的制作过程中,舞台上放置纸张材质图片和一幅国画图片。使用带有黑白渐变效果的矩形影片剪辑作为遮盖物,接合影片剪辑的混合模式的设置,创建国画融入纸张材质中的效果。在舞台上添加文字,通过为文字添加滤镜、设置混合模式和调整文字的色彩效果,获得贴于国画上的古诗效果,古诗的纸张材质显示得与国画纸张材质相同。通过本例的制作,读者将能了解影片剪辑的混合效果和色彩调整的方法以及不同混合方式带来的不同显示效果,掌握将对象融于背景的制作技巧。6.2.5实战范例——诗配画2.制作步骤略。请参看教材或者观看配盘上的视频教程。6.3库6.3.2外部库6.3.1库的基本操作6.3.3公用库6.3.4实战范例——中秋月6.3库在Flash中,库用于存放动画元素,用来存储和管理用户创建的各种类型的元件,同时也可以放置导入的声音、视频、位图和其他各种可用的文件。在Flash中,库就像一个仓库,在合成动画时,只需要从这个仓库中将需要使用的“部件”拿出来,应用到动画中即可。使用库,能够给创作带来极大的方便,省略很多地重复操作,且可以使不同的文档之间共享各自库中的资源。6.3.1库的基本操作1.新建和删除元件2.使用文件夹3.复制元件4.查看属性6.3.2外部库在制作动画时,用户可以使用已经制作完成的动画中的元件,这样可以简化动画制作的工作量、节省制作事件并提高制作效率。要使用外部库,可以采用下面的方法操作。选择【文件】|【导入】|【打开外部库】命令打开【作为库打开】对话框,在对话框中选择需要打开的源文件,单击【打开】按钮,即可打开该文档的【库】面板。此时,只需在【库】面板中将需要使用的元件拖放到舞台,该元件即成为当前文件的实例,同时该元件将出现在当前文档的【库】面板中。6.3.3公用库在Flash中,库实际上分为专用库和共用库。专用库,就是当前文档使用的库。共用库是Flash的内置库,其不能进行修改和相应的管理操作。在【窗口】菜单的【共用库】子菜单中有3个选项,它们是【声音】、【按钮】和【类】,分别对应Flash中的3种共用库。1.声音库2.按钮库3.类库6.3.4实战范例——中秋月1.范例简介本例介绍中秋月夜场景制作过程。在本例的制作过程中,使用图形工具绘制山峦、月亮和星星,转换为影片剪辑后,重复使用它们,并利用【属性】面板设置影片剪辑的属性以获得需要的特效。场景中的枝叶,使用外部“*.fla”文件的库中的元件,简化制作过程。使用【文本工具】添加古诗,并添加滤镜。通过本例的制作,读者将掌握【库】面板的常用使用方法和外部库的使用方法。同时进一步熟悉通过使用滤镜来创建特效的方法。2.制作步骤略。请参看教材或者观看配盘上的视频教程。6.4本章小结本章学习Flash中元件的类型及其创建和编辑的方法,同时介绍了在作品中使用实例的方法和技巧,最后学习了Flash的库的特点和使用方法。通过本章的学习,读者将能够掌握元件和实例的概念,了解它们之间的关系以及在作品中它们的不同作用。同时,了解Flash的库和【库】面板,能够使用【库】面板来实现对元件的管理。6.5本章练习6.6上机练习和指导6.6.2蜡笔画效果6.6.1古画配诗——梅6.6.1古画配诗——梅主要操作步骤指导:(1)导入背景图片和梅花图片到舞台。将梅花图片转换为影片剪辑,在【属性】面板的【显示】栏中,将混合模式设置为【正片叠底】。在【色彩效果】栏中的【样式】下拉列表中选择【高级】选项,对图片的颜色进行调整。使用提供的素材图片创建古诗画效果,效果如图6.94所示。6.6.1古画配诗——梅主要操作步骤指导:(2)输入文字“梅”,将文字颜色设置为黑色(其颜色值为“#000000”),在【属性】面板的【显示】栏中将混合模式设置为【叠加】。(3)输入古诗,在【属性】面板中将文字颜色设置为黑色(其颜色值为“#000000”),设置文本的字间距和行间距。在【容器和流】栏中将笔触颜色设置为黑色,笔触宽度设置为“25像素”,以颜色值为“#E0C49C”的颜色进行纯色填充。在【显示】栏中将混合模式设置为“叠加”。为文本添加【投影】、【发光】和【斜角】滤镜,根据需要调整滤镜的参数。6.6.2蜡笔画效果使用提供的素材图片,制作蜡笔画效果,如图6.95所示。主要操作步骤指导:(1)将素材图片导入到舞台,调整图片的大小后将图片转换为影片剪辑。为影片剪辑添加【模糊】滤镜,根据需要修改【模糊X】和【模糊Y】的值。(2)从【库】将影片剪辑再次拖放到舞台上,与上一步的图画对齐。在【属性】面板的【显示】栏中将混合模式设置为【变暗】即可。