基于Flash的城市风景动画设计阮成庆 数学与计算机科学学院摘 要：近年来，随着网络的飞速发展，flash动画技术以其容量小，制作成本低，视觉冲击力等优势走进了社会大众的生活中，主要应用于商业宣传，故事表现，网络游戏，教学过程模拟等不同行业的展示活动中。 越来越多的城市开始注重打造城市名片，积极宣传城市文化，主要以宣传风景为主，以提升城市的知名度和带动旅游业，谋取更快地发展，其中flash动画是其中主要手段之一。 本文利用Flash工具对城市建设进行交互式动画设计，便于人们了解城市文化，其中伴有PS图像处理和CoolEdit声音处理。关键词：flash，ActionScript,交互式动画，声音处理 The design of city landscape animation based on FlashAbstract: in recent years, with the rapid development of network, flash animation technology for its small volume, low manufacturing cost, the visual impact of advantage into the social public life, mainly used in commercial propaganda, the story of the performance, the network game, showing the activities of teaching process simulation in different industries.More and more of the city began to pay attention to build the city card, actively promoting the city culture, mainly in the propaganda of the scenery, in order to improve the citys visibility and promote tourism, for faster development, in which the flash animation is oneof the methods.In this paper, by means of Flash interactive animation design for city construction, is convenient for people to know the city culture, which accompanied with PS CoolEdit image processing and voice processing.Keywords: flash, ActionScript, interactive animation, sound processing 第1章 绪论1.1引言 FLASH是由美国Macromedia公司于1996年6月推出的用于矢量图编辑和动画创作的专业软件。网页设计者可以利用flash软件制作出既美观又可以改变大小的导航画面及其它奇特的效果 。被广泛的应用于多媒体领域 ，如 动画游戏制作，网络构件，学习课件，网站广告设计及全flash网站，工控界面等交互式软件和产品展示。主要优点是制作起来方便，通用性强，文件体积小，支持交互，涉及的领域多，制作出的东西效果都可以做到很棒，不依赖于任何媒体播放器。缺点在于有些效果需要别的软件辅助制作，不是所有效果都能制作出来。（比如图片处理，flash就很难做到，只能通过做到剪裁和渲染） Flash是一种交互式矢量多媒体技术，他的前身是Futureplash，早期网上流行的矢量动画插件。后来由于Macromedia公司收购了FutureSplash以后便将其改名为Flash2，到现在最新的flashcs3。现在网上已经有成千上万个Flash站点，著名的如Macromedia专门ShockRave站点，全部采用了ShockwaveFlash和Director。可以说Flash已经渐渐成为交互式知量的标准，未来网页的一大主流。 本文主要用制作一个具有交互性的城市风景展示，其中伴有处理图片和处理声音。该设计主要有两部分组成交互式动画和音频，用Flash软件做出的动画作品，其最大的特点是它能够把一些位图和按钮、文字做成交互性很强的动画，不仅具有视觉和听觉的双重感受，使其更具有趣味性和创造性。. 的相关概念. .什么是动画动画是将静止的画面变为动态的艺术，实现了由静止到动态，主要是靠人眼的视觉残留效应利用人的这种视觉生理特性可制作出具有高度想象力和表现力的动画影片。动画以人类视觉的原理为基础。 如果快速查看一系列相关的静态图像，那么我们会感觉到这是一个连续的运动。 每一个单独图像称之为帧。帧是动画中的单个图像。. .什么是交互式动画所谓Flash交互式动画是指通过Flash完成的动画作品，在播放的同时能够接受来自外部的实时控制，其可以是播放人员，同样也可以是动画的观众。具体来看，就是观众能够通过鼠标，以及键盘等控制动画的播放，这样的全新设计就可以让普通的观众演变身份，可以从被动转为主动，这是传统动画所不具备的，在Flash中却能轻松实现 。另外其实时传播接收的信息效果更加良好，其反应信息会更加的快速和直接。 1.2.3 关于actionsciptActionscript 是Flash MX 2004的脚本语言。用脚本语言编写的程序嵌入到Flash动画后可以控制影片的播放（即向影片片断发送命令、指定动画执行的内容、分析用户操作、显示反馈信息等），这种双向交流可生成交互动画。1.2.4交互式动画原理交互式动画是由触发动作的事件、事件的目标和触发事件的动作3个因素组成的，例如单击按钮后，影片开始播放这一事件。其中，单击是触发动作的事件，按钮是事件的目标，影片开始播放是触发事件的动作。换句话说，事件、目标和动作构成了一个交互式动画。在Flash中，事件包括鼠标事件、键盘事件和帧事件三种。目标包括时间轴、按钮元件和影片剪辑元件三种。而动作就是指控制影片的一系列脚本语言，所以说脚本语言的编写也就是各种动作的编写 。第3章 概要设计3.1 素材收集及图像处理 选择几张有关于城市风景的精美图片，并用photoshop对其进行适当的处理。3.2导入图像 打开flash mx 2004，将处理过的图片导入库中，移至新文件夹中，命名为位图。3.3时尚按钮的制作 用文本工具制作按钮文本 将设置好的按钮文本转化为图形元件 将按钮图形转化为按钮元件 利用工具栏的矩形工具制作按钮的感应区 为各个按钮的各个动作进行设计3.4对导入库的图像素材进行设计3.5遮幕层的应用3.6舞台的设计及为按钮加入ActionScript3.7动画的发布与测试第4章 详细设计与制作4.1素材收集及图像处理素材收集及图像处理过程如下。（1) 收集6张城市风景的精彩图片（2) 利用Adobe Photoshop进行图片处理以符合同样的大小；图像大小的设置，宽度为600像素，高度为250像素（3) 利用Adobeshop的渐变工具，对原图片的色调加以渐变（4) 打开Flash MX 2004,选择【修改】菜单下的【文档】选项，在弹出的“文档属性”对话框内，设置场景尺寸为800*250，“背景颜色”为蓝色，“帧频”为“120”，“标尺单位”为”像素”4.2导入图像导入图像的过程如下（1） 将利用Photoshop处理过的六张图片导入到库中。方法是选择【文件】菜单下的【导入】子菜单中的【导入到库】选项（2） 在弹出的“导入到库”对话框中，选择6张已经处理好的图片，单击【打开】按钮，完成导入到库（3） 选择【窗口】菜单下的【库】选项，库中已经有了处理好的6张图片，为了库中的文件管理，将6张图片移至新文件夹，方法是选择0106张位图，单击鼠标右键，在弹出的快捷菜单中选择【移至新文件夹】选项，在弹出的对话框中输入“位图”字样（4） 单击【确定】按钮，完成文件夹的建立。双击文件夹图标即可关闭文件夹，再双击文件夹图标即可打开文件夹4.3时尚按钮制作时尚按钮的制作过程如下。（1） 制作城市风景动画的二级按钮。选择工具栏中的文本工具，在场景中输入“SUBMENU_01”字样，在属性栏中设置文字大小为8，字间间距为0.5，其他为默认值（2） 将设置好的按钮文本转化为元件。单击鼠标右键，在弹出快捷菜单中选择【转化为元件】选项，在弹出的对话框中，设置“行为”为“图形”模式，在“名称”文本框中输入“SUB01”，单击【确定】按钮，完成设置（3） 选择场景中的文件元件，在属性栏中设置颜色为Alpha,将Alpha值设置为50%，其他为默认值（4） 用同样的方法再新建SUBMENU_02，SUBMENU_03，SUBMENU_04，MENU_01，MENU_02，MENU_03，MENU_04，MENU_05，MENU_06的元件图形，然后将它们移至新文件夹。选择10个元件图形，单击鼠标右键，在弹出的快捷菜单中选择【移至新文件夹】选项，在弹出的对话框中输入“按钮图形”字样（5） 下面利用前面做好的文本图形制作按钮。选择【插入】菜单下的【新建元件】选项，在弹出的对话框中将“行为”设置为“按钮”模式，在“名称”文本框中输入“SUBMENU_01”,单击【确定】按钮，完成设置（6） 双击“库”中新建的SUBMENU_01按钮，这时场景中弹出SUBMENU_01的编辑窗口和时间轴，在时间线上选择“弹起”选项，然后将库中的“SUB01”拖动到场景中，注意将SUB01的中心与SUBMENU场景中的中心对齐；在属性栏中设置X的位置为-31.3，Y的位置为-6.6，设置颜色为Alpha，将Alpha值设置为50%，其他为默认值（7） 在时间线上的”指针经过“，”按下“处插入关键帧，然后用鼠标左键单击”指针经过“，将库中的”SUB01“拖动到场景中，注意使SUB01的中心与SUBMENU_1场景中的中心对齐；在属性栏中设置X的位置为-31.4，Y的位置为-6.5，设置颜色为Alpha，将Alpha值设置为75%，其他为默认值（8） 利用工具栏中的矩形工具制作按钮的感应区。在”点击“的选项的场景中绘制长方形，在属性栏中设置宽为67.3，高为15.6，位置X为-33.7，Y为-7.6，颜色为蓝色（9） 关闭按钮SUBMENU_1，用同样的方法制作SUBMENU_1，SUBMENU_2,SUBMENU_3,SUBMENU_4按钮（10） 建立首页面的主按钮button_1,选择【插入】菜单下的【新建元件】选项，在弹出的对话框中将“行为”设置为“按钮”模式，在“名称”文本框中输入“button_1”，单击【确定】按钮，完成设置； 双击“库”中的新建的button_1按钮，这时场景中弹出button_1的编辑窗口和时间轴，分别在“弹起”，“指针经过”，“按下”，“点击”处按【F6】键插入关键帧，在时间轴上选择“弹起”选项，然后将“库”中的“MENU_01”拖动到场景中，在属性栏中设置宽为49.2，高为14.3，X的位置为-55.0，Y的位置为-9.6，颜色为“#F5F295“（11） 在时间轴上分别选