《动漫设计与图像处理》-第8章

第8章Flash元件实例和脚本动画《动漫设计与图像处理》之学习内容元件的创建、修改与使用方法1ActionScript脚本的应用ActionScript脚本制作动画234ActionScript的基本语法规则8.1图形元件8.1.1图形元件的概念元件定义：是在flash中创建的图形、按钮和影片剪辑，是flash动画设计最基本、最重要的元素。特点：可以自始至终在影片或其它影片中重复使用；每个元件都可以有自己的时间轴、场景和完整的图层；存放在库里。8.1.2图形元件的创建方法在Flashcs4中，创建一个性的空白图形元件操作步骤如下：【步骤1】创建一个新文档，按Ctrl+F8或是选择“插入新建元件”都会跳出新建元件的窗口如图8-1所示【步骤2】在对话框中输入元件名称，“类型”下拉选择为“图形”，单击“确定”按钮。【步骤3】创建图形元件后，自动进入元件编辑状态，元件的名称显示在库中的名称栏下，在工作区里显示“+”好，该点位元件的注册点。如图图8-2所示。8.1.2图形元件的创建方法在Flashcs4中，创建一个性的空白图形元件操作步骤如下：【步骤1】创建一个新文档，按Ctrl+F8或是选择“插入新建元件”都会跳出新建元件的窗口如图8-1所示【步骤2】在对话框中输入元件名称，“类型”下拉选择为“图形”，单击“确定”按钮。【步骤3】创建图形元件后，自动进入元件编辑状态，元件的名称显示在库中的名称栏下，在工作区里显示“+”好，该点位元件的注册点。如图图8-2所示。8.2影片剪辑元件创建实例改变实例的颜色和透明度改变实例的形状分离实例改变实例的类型8.2.1影片剪辑的概念影片剪辑元件是Flash中应用最为广泛的元件类型，可以将它自身理解成为一个小动画。在影片剪辑元件中可以制作独立的影片，除了不能将元件置于其自身内部之外，制作影片的方法与在场景中没有区别8.2.2影片剪辑元件的创建方法创建一个影片剪辑元件的操作步骤如下：【步骤1】创建一个新文档，设置时间轴如图8-9所示。选择“插入新建元件”命令，弹出新建元件对话框，在类型下拉框中选择“影片剪辑”，如图8-10所示【步骤2】单击“确定”进入编辑状态，选择“多边形工具”，在舞台中绘制出一个红色的五角星，并视其相对舞台居中对齐，如图8-11所示8.2.3将动画转换为影片剪辑元件将动画转换为影片剪辑元件的操作步骤如下：【步骤1】创建一个新文档，选择“文件打开”命令，打开“将一只蝴蝶转换成图形元件”动画。【步骤2】选中图层中的所有帧右击，从弹出的快捷菜单中选择“复制帧”命令。8.2.3将动画转换为影片剪辑元件【步骤3】选择“插入新建元件”命令，在对话框中输入影片剪辑的名字，选择“影片剪辑”类型。【步骤4】单击“确定”按钮，进入元件编辑状态，在”图层1”的第1帧处右击，选择“粘贴帧”命令，创建影片剪辑完毕。8.3按钮元件8.3.1按钮元件的概念通过绘制与鼠标事件相对应的对象，按钮元件主要用于创建响应鼠标事件的交互式按钮。鼠标事件包括鼠标触及与单击两种。将绘制的图形转换为按钮元件，在播放影片时，当鼠标靠近图形时，光标就会变成小手状态，为按钮元件添加脚本语言，即可实现影片的控制8.3按钮元件8.3.1按钮元件的概念按钮元件就是响应鼠标事件的元件，而响应鼠标事件的各种效果可通过自行设置来表现。8.3.2按钮元件的创建方法【步骤1】创建一个新文档，选择“插入新建元件”命令，弹出新建元件对话框，在名字框输入“play”，类型选择“按钮”，如图8-17所示。【步骤2】点确定，进入按钮元件编辑状态，如图8-18所示，在时间轴处可定义四个状态的按钮关键帧。【步骤3】在舞台中绘制出按钮的行状，如图8-19所示，根据需要可以绘制按钮的其他几个状态的关键帧，这里不做详解，按钮元件创建完毕8.3.2按钮元件的创建方法8.4脚本动画的基础8.4.1ActionScript的概述ActionScript动作脚本是遵循ECMAscript第四版的AdobeFlashPlayer运行时环境的编程语言。它在Flash内容和应用程序中实现交互性、数据处理以及其他功能。8.4脚本动画的基础ActionScript语句是Flash提供的一种动作脚本语言，它具有强大的交互功能，通过在动画中添加相应的语句，使得Flash能够实现一些特殊功能。在FlashCS3以上的版本中ActionScript具有和统一的JavaScript相似的结果，以面向编程的思想为基础，采用Flash中的事件对程序进行驱动，以动画中的关键帧，影片剪辑和按钮作为对象来对ActionScript进行定义和编写，因此，ActionScript是Flash中不可缺少的重要部分。8.4.2ActionScript的语法规则1.点语法在ActionScript中，点(.)被用来指明和某个对象或电影剪辑相关的属性和方法。它也用标识指向电影剪辑或变量的目标路径。点语法表达式由对象或电影剪辑名开始，接着是个点，最后是要指定的属性、方法或变量。例如，表达式ballMC.x是指电影剪辑实例ballMC的_X属性，_X电影剪辑属性指出编辑区中电影剪辑的X轴位置。2.斜杠语法Flash的以前版本是使用斜杠语法指出电影剪辑或变量的目标路径的。FlashMX播放器仍然支持这种语法，但不推荐使用。在斜杠语法中，斜杠被用来代替点，用以标明电影剪辑或变量的路径。要指出一个变量，能够在变量前加上冒号，如下面的语句所示：myMovieClip/childMovieClip:myVariable我们现在用点语法取代上述斜杠语法来表示上面的目标路径：myMovieClip.childMovieClip.myVariable3.大括号ActionScript语句用大括号({})分块，如下面的脚本所示：on(release){myDate=newDate();currentMonth=myDate.getMonth();}4.分号ActionScript语句用分号(；)结束，但假如您省略语句结尾的分号，Flash仍然能够成功地编译您的脚本。例如，下面的语句用分号结束：colum=passedDate.getDay();row=0;同样的语句也能够不写分号：colum=passdDate.getDay()row=05.圆括号定义一个函数时，要把参数放在圆括号中：functionmyFunction(name,age,reader){}调用一个函数时，也要把要传递的参数放在圆括号中：myFunction(Steve,10,true);5.圆括号圆括号能够用来改变ActionScript的运算优先级，或使自己编写的ActionScript语句更容易阅读。也能够用圆括号来计算点语法点左边的表达式。例如，在下面的语句中，圆括号使表达式newcolor(this)得到计算，并创建了一个新的颜色对象：onClipEvent(enterFrame){(newColor(this)).setRGB(oxffffff);}6.大小写字母在ActionScript中，只有关键字区分大小写。对于其余的ActionScript，能够使用大写或小写字母。例如，下面的语句是等价的：cat.hilite=true;CAT.hilite=true;7.注释需要记住一个动作的作用时，可在动作面板中使用comment(注释)语句给帧或按钮动作添加注释。假如您在协作环境中工作或给别人提供范例，添加注释有助于别人对您编写的脚本的正确理解。在动作面板中选择comment动作时，字符“//”被插入到脚本中。假如在您创建脚本时加上注释，即使是较复杂的脚本也易于理解.8.4.3ActionScript的主要命令1.goto命令goto命令是“无条件跳转”语句，该语句不受任何条件约束，可以跳转到任意场景的任意一帧。goto语句有两种基本跳转模式:命令格式1：gotoAndPlay(场景,帧)命令格式2：gotoAndShop(场景,帧)2.nextFrame和nextScene命令命令格式1：nextFrame()命令格式2：nextScene()作用：跳到下一帧（场景）并停止播放。例如单击按钮，跳到下一帧并停止播放：on(release){nextFrame（）}3.prveFrame和prevScene命令命令格式1：prveFrame()命令格式2：prevScene()作用：跳到前一帧（场景）并停止播放。4.play和stop命令命令格式1：play()命令格式2：stop()作用：使影片从当前帧开始（停止）播放。5.stopAllSounds命令命令格式：stopAllSounds()作用：停止播放当前所有声音，但不停止播放动画。6.on命令命令格式：on()作用：按钮脚本命令。是事件处理函数，当特定事件发生时要执行的代码。例如单击鼠标后放开事件，语句如下：on(release){}7.startDrag命令命令格式：startDrag()作用：规定相应事件发生的时候，将指定的影片剪辑跟随鼠标一起移动。8.5多媒体技术的应用8.5.1声音的属性设置在Flash中有两种声音类型：事件声音和音频流。事件声音不像完全下载后才能开始播放，除非停止，否则它将一直连续播放。音频流在前几帧下载了足够的数据后就开始播放；音频流要与时间轴同步，以便在网上播放。添加声音有两种方式在FlashCS4中要给帧添加声音有两种方式，一种是使用公用库中的声音：选择“窗口公用库声音”命令，弹出声音库面板，如图8-54所示，将声音添加到帧中。另一种则是从外部声音，选择“文件导入导入到库”命令，把需要添加的声音导入到库中，库面板如图8-55所示，这样便可在动画或帧中添加声音。引用到时间轴上的声音引用到时间轴上的声音，往往还需要在声音属性面板中对它进行恰当的属性设置，才能更好地发挥声音的效果。在添加了声音的帧的属性面板如图所示，分别有名称、效果和同步三大选项。如图8-56所示。声音属性面板8.5.2为动画添加声音为动画添加声音又很多种方法，这里说明其中一种，首先导入声音道库，选择“文件导入导入到库”命令，把声音导入库，然后在点“新建图层”按钮，将声音拖入图层中，要注意设置好声音与动画的同步：在声音的属性栏中“同步”项选择“停止”即可8.5.3为关键帧添加声音要为关键帧添加声音的方法如下：首先将要添加的声音导入库，选择“文件导入导入到库”命令，把声音导入库，然后选中要添加声音的关键帧，在属性面板声音“名称”项选择刚添加进来的声音，然后选择需要的“效果”和“同步”即可。为关键帧添加声音操作步骤如下：【步骤1】选择“文件打开”命令，从“第8章\素材”文件夹中，打开“素材”源文件，选择“文件导入导入到库”命令把“素材与源文件\第8章\创建一个有声音的按钮”文件夹中的“1.wav”声音文件导入到库中。【步骤2】选择“图层1”的第90帧，右击选“动作”进入动作面板，输入以下“stop()”如图8-57所示为按钮添加声音为按钮添加声音的操作步骤如下：【步骤1】选择“文件打开”命令，“从第8章\素材”文件夹中，打开“创建一个图形按钮元件”源文件。选择“文件导入导入到库”命令把“\第8章\素材”文件夹中的“1.wav”声音文件导入到库中。【步骤2】双击“图形按钮”元件进入元件编辑状态如图8-59所示。【步骤3】选中“按下”帧，在属性面板中添加刚导入的“1.wav”声音，声音设置面板如图图8-60。为按钮添加声音【步骤4】将文件保存到“素材与源文件\第8章\为按钮添加声音”文件夹下，并将文件命名为“为按钮添加声音.fla”,按Ctrl+Enter组合键测试影片效果。为按钮添加声音本章小结Flash是Macromedia公司的一款多媒体矢量动画软件，具有交互性强、文件尺寸小、简单易学的特点。与以前的版本相比，FlashC