搜索
第13章Flash特效制作内容概述-本章主要讲述了用Flash制作特殊动画效果和Flash配合其他技术实现网页交互功能（动态网页）两个方面的内容。Flash软件一个相当重要的应用领域是网页交互，使用Flash可以制作出各种实用的网页交互效果且使用Flash制作出的交互网页特效外观华丽，配合ASP、JavaScrip等技术可以在网页制作领域发挥强大功能。本章介绍的作品涉及的内容大都是网上使用较多且比较实用的，希望读者通过本章的学习，激发创作灵感，创作出更为优秀的Flash作品。教学目标1．掌握利用Flash制作网页特效的方法。2．了解利用Flash制作网页下拉菜单的方法。3．了解Flash的网络交互功能。13.1网页特效13.2菜单13.3网络交互本章小结13.4练习题13.1网页特效目前Flash动画在因特网上的应用以几何级数增长，因为其效果是传统网页所不可比拟的，所以掌握和学习些Flash网页特效的操作是必需的。13.1.1网页时间动态显示的制作13.1.2动态文本的制作13.1.3Logo制作13.1.1网页时间动态显示的制作在网页中插入一个漂亮的电子时钟，可以使网页即看起来美观又为浏览者提供方便。Flash中提供的简单实用的Data类可以动态显示当前的时间，来达到这一目的。这里的实例是用一个动态文本来显示时间。既然要动态地显示当前的时间，自然就要有一个定时机制不断地更新当前的时间，而影片剪辑的EnterFrame事件就很合适。制作步骤：【步骤1】创建一个影片剪辑元件，把它的一个实例拖入舞台场景中。【步骤2】在舞台中放置一个动态文本，赋予其实例名为MyText。【步骤3】在影片剪辑实例上捆绑下面的脚本.【步骤4】在舞台上选择动态文本，然后在“属性”面板中单击“嵌入…”按钮，在弹出的“字符选项”对话框中选中“指定范围”，并在“包含这些字符”文本框中输入“年月日时分秒0123456789”。这样做的目的是嵌入这几个字符的字体轮廓，从而可以以抗锯齿方式在动态文本中显示这些字符【步骤5】测试影片，可以看到这只电子钟的工作情况13.1.2动态文本的制作动态文本是一种交互式的文本对象，文本会根据文本服务器的输入不断更新，如天气预报、股票价格等。它允许用户随时更新动态文本中消息，即使在作品完成后也可以改变其中的信息。13.1.3Logo制作预载画面的原理是简单的，就是通过建立关键帧，第一个关键帧是动画帧，用于放置预载动画、已经读入的百分比计算等，第二个关键帧用于循环，使影片在没有完全读取之前，不进入正式的画面。这里先介绍要用到的两个重要命令：getBytesLoaded()：得到已经读取的字节数。getBytesTotal()：得到需要读取的字节数总数。操作步骤：【步骤1】新建文件：新建一个电影文件，命名为“PreLoader.fla”。【步骤2】制作进度条：将“图层1”命名为“Bar”，在第一帧中，使用“矩形”工具，绘制一个宽200像素、高20像素的矩形，再绘制其外框。同样使用“矩形工具”绘制一个矩形，设置其笔触高度为3，删除中间的填充颜色，使用“任意变形”工具修改其大小，绘制的进度条最终形态，选中该进度条的主体（不带边框），按F8快捷键，将进度条图片转化为影片剪辑元件。在弹出的“转化为元件”对话框中将元件名称设置为“MyBar”，注意“注册”的选择，将基点定在左边的中间，单击“确定”按钮完成设置。为“MyBar”影片剪辑设置实例名称，这样ActionScript语句就可以使用实例名称来控制进度条的宽度。选中“MyBar”影片剪辑，按Ctrl＋F3组合键调出属性面板，填写实例名称“progressBar”，把“宽度”改为1.0像素，【步骤3】制作百分比文本框：在舞台上需要用一个动态文本框来显示已经读取内容的百分比，以及读取多少字节等动态信息。使用“文本工具”添加一个文本框，放置在进度条的正下方。将“文本类型”设置为“动态文本”，在这里尤其要注意的是将“变量”选项设置为“LoadDate”（Data是保留字，不能作为变量名）。在线条类型下拉列表框中选择“多行”选项，以便输入多行文字，单击“多行”右边第二个按钮，将文本呈现为HTML语句。【步骤4】导入电影内容：新建图层，命名为“Content”在该图层第3帧按F7插入一个空白关键帧，导入一张图片，在该图层第30帧处按F5增加帧。【步骤5】输入ActionScript代码。可以用getBytesLoaded()函数得到已经读取的字节数，而用getBytesTotal()得到总共有的字节数，利用这两个数字就可以计算得到一个百分比，已经确定了使用第二帧作为循环，不断扫描第一帧的ActionScript，这样百分比放在第一帧就可以计算一些所需要的数据。新建一个图层“Action”，在第2帧和第3帧插入空白关键帧。选中“Action”层的第1帧，然后按F9，在弹出的窗口中，输入代码.注意：测试时按Ctrl+Enter是看不出效果的，因为该文件已经保存在硬盘中，并不需要从网上下载；连续两次按Ctrl+Enter才能模拟网站上浏览的情形，实现预载的效果。连续两次按Ctrl+Enter组合键以后，查看播放器中“视图”菜单，其中有一个“下载设置”子菜单.“下载设置”子菜单有多种下载设置可供选择。一般情况下选择56k，这样就完成了预载画面的制作。13.2菜单可以利用Flash的交互功能制作模拟菜单下拉菜单的制作【步骤1】运行Flash8，新建一个Flash文档。【步骤2】选择“文件”/“导入”/“导入到舞台”命令，在弹出的“导入”对话框中选择一个图形文件并将其导入到舞台中，【步骤3】选择菜单中的“插入”/“新建元件”命令，弹出“创建新元件”对话框。在该对话框的“名称”文本框中输入“标题”，类型选择“按钮”选项。【步骤4】单击“确定”按钮，进入“元件”编辑模式。选择“矩形”工具，笔触颜色设置为褐色，填充颜色为绿色，然后再绘制矩形，【步骤5】选中“指针经过”帧按F6键插入关键帧，选择“矩形”工具，笔触颜色设置为浅绿色，填充颜色为无色，然后再绘制矩形。【步骤6】选择菜单栏中的“插入”/“新建元件”命令，如【步骤3】新建一个按钮元件，命名为“菜单”。【步骤7】单击“确定”按钮，进入元件编辑模式。定位在“弹起”帧上，选择“矩形”工具，笔触颜色设置为褐色，填充颜色为浅灰色，然后再绘制矩形。【步骤8】选中绘制的矩形，然后删除矩形的上下2条边线，【步骤9】选中“指针经过”帧按F6插入关键帧，选择“矩形”工具，笔触颜色设置为浅绿色，填充颜色设置为浅黄色，然后再绘制矩形，【步骤10】单击“场景1”按钮，返回到主场景中。单击“插入图层”按钮，在“图层1”的上面添加“图层2”，将“库”面板中的“标题”元件拖入到舞台，然后继续拖动2次“标题”元件到舞台中【步骤11】分别在“图层1”和“图层2”的第15帧按F5键插入帧。在“图层2”上面添加一个“图层3”，在“图层3”的第5帧按F6插入关键帧，然后将“库”面板中的“菜单”元件拖动到舞台，【步骤12】按住Alt建的同时拖动“菜单”元件，将其复制到“标题”元件的正下方，对齐位置，同样复制出多个“菜单”元件，用作不同的菜单项，【步骤13】在“图层3”的第10帧、第15帧上分别按F6键插入关键帧，然后将“菜单”元件移动到相应“标题”元件的下面，并对齐位置。【步骤14】在“图层3”上面新建“图层4”，选择文本工具，在舞台上输入文本“环保标准”、“环保知识”和“生态园林”，并调整文本的大小及位置，分别位于第1个、第2个和第3个“标题”元件的上面，【步骤15】在“图层4”的第5帧上按F6插入关键帧，使用文本工具在所有的“菜单”元件上输入文本，【步骤16】在“图层4”的第10帧和第15帧上按F6分别插入关键帧，使用“文本”工具在所有的“菜单”元件上输入文本，【步骤17】在“图层2”的第1帧、第5帧、第10帧和第15帧按F6插入关键帧，选择菜单中的“窗口”/“动作”命令，打开“动作”面板，分别添加命令行Stop();用来控制动画的播放。【步骤18】选中“图层2”的第1帧的第1个“菜单”元件，在“动作”面板中输入如下脚本代码：On(Release){GotoAndPlay(5);}【步骤19】选中“图层2”的第1帧的第2个“菜单”元件，在“动作”面板中输入如下脚本代码：On(Release){GotoAndPlay(10);}【步骤20】选中“图层2”的第1帧的第3个“菜单”元件，在“动作”面板中输入如下脚本代码：On(Release){GotoAndPlay(15);}【步骤21】插入新建元件，命名为“返回”，类型为“按钮”。【步骤22】单击“确定”按钮，进入元件编辑模式。选择矩形工具，笔触颜色为无色，填充颜色为任意颜色，然后绘制矩形，并将矩形的透明度改为0％，【步骤23】在“图层1”上面新建“图层5”。在“图层5”的第5帧插入关键帧，从“库”面板中将“返回”元件拖动到当前第5帧的舞台中，调整整个元件的大小和位置，使它与整个菜单重合并比菜单大些【步骤24】选中“返回”元件，在“动作”面板中输入程序代码：on(rollOver){gotoAndPlay(1);}，【步骤25】按Ctrl＋Enter可预览效果，13.3网络交互13.3.1Flash网络交互功能简介Flash脚本编程指的就是利用Flash内建的ActionScript语句进行程序设计。ActionScript语言自形成以来已经发展了多年。FlashProfesional8引入的一些新的语言元件而且更彻底地实现了面向对象编程。高级的Flash编程可以实现复杂的交互游戏，根据用户的操作响应不同的电影，与后台数据库及各种程序进行交流，如ASP、PHP、SQLServer等。庞大的数据库系统及各种程序与Flash内置的编程语句相结合，可以制作出很多人机交互的网页、游戏以及在线商务系统。13.3.2JS与Flash实现交互1．从Flash到JavaScrip的通信一个HTML页面中的Flash电影，能把消息发送到位于同一HTML页面中的JavaScript程序的原理，是因为当Flash电影调用fscommand函数时，位于同一HTML页面中的一个名为movieName_DoFSCommand的JavaScript函数会被自动调用，而在fscommand函数中指定的参数会被movieName_DoFSCommand函数截获，从而实现通信。在这里，movieName_DoFSCommand中的movieName是在EMBED标签的NAME属性或OBJECT标签的ID属性中指定FlashPlayer的名字。例如，如果FlashPlayer被指派了名字myFlash，那么调用的JavaScript函数将是myFlash_DoFSCommand。fscommand函数的使用格式如下：fscommand(“command”,“parameter”)在这里，如果消息是要被发送到JavaScript程序，那么command就应该是你自定义的命令，这个自定义的命令实际上是一个字符串，这个字符串会被作为参数传递给movieName_DoFSCommand函数，而parameter是你为command命令指定的值，parameter也是一个字符串，也将被作为参数传递给movieName_DoFSCommand函数；如果消息是要被发送到播放该Flash电影的FlashPlayer从而对FlashPlayer进行一些控制，则command就应该是预定义的一些“命令”，而parameter相应的也应该是针对这些预定义的可用的值。2．从JavaScrip到Flash的通信一个HTML页面中的JavaScrip程序能把消息发送到位于同一HTML页面中的Flash电影的原理是：因为你可以从JavaScrip程序调用