《二维flash动画制作》第10章 成都市十大产业集群分布展示 .ppt

第3部分 进阶篇——商业项目实战 第10章 成都市十大产业集群分布展示 10.1 项目设计说明 10.2 项目操作说明 10.3 项目制作说明 10.4 具体制作 10.1 项目设计说明 本项目是“今日成都”主题展馆内的一个子项目，主要是展示成都市十大产业集群、三大产业功能区的分布情况。 10.2 项目操作说明 本项目采用Flash制作，最终将在展厅内的一个22寸触摸屏上进行操作演示，供参观者自主操作使用。 本项目的主操作界面如图10.1所示。 屏幕中间是一个成都市地图，由三种主要颜色进行区分，从而形成三个部分，分别是“中心城区”、“二圈层”和“三圈层”。 屏幕左下角是图例，对三个区域的颜色进行了标识。 屏幕右上角是“互动游戏”按钮，点此按钮将跳转至项目的另外一个界面。 屏幕右边区域是对十大产业集群及三大产业功能区进行了说明。 项目起动后，中心城区、二圈层、三圈层这三部分将依次闪烁出现，然后是完整地图缩放出现。完整地图中，有三个放大镜图标及三大产业功能区的名称，点击放大镜或者是某个产业功能区的文字，将弹出与此功能区对应的一个窗口，内有此功能区的说明，如图10.2所示。 弹出的窗口可以用鼠标拖动以放在屏幕中的任意位置。单击弹出窗口右上角的“X”可将弹出窗口关闭。如果没有关闭弹出窗口，又点击其它放大镜，可弹出多个窗口，如图10.3所示。 整个成都市的地图添加了鼠标滚轮缩放效果，将滚轮向上滚动，可放大地图，将滚轮向下滚动，可缩小地图，如图10.4所示。使用鼠标左键可在屏幕范围内将地图拖至任意位置，如图10.5所示。 点击右上角的“互动游戏”按钮，将跳转至“互动游戏”界面，如图10.6所示。 在“互动游戏”中，屏幕右边有若干小图标，屏幕中间的地图由若干色块构成，一种色块代表一个区域。操作时，将右边的小图标拖至左边的色块中即可。 若小图标拖放正确，将弹出“恭喜你，完全正确”的提示，同时，小天使也会出现在屏幕上，当前拖放的小图标将停留在正确的区域，同时，右边的图标列表中，该小图标将会消息，如图10.7所示。 如果操作错误，将会出现“很遗憾，操作错误”的提示，同时，当前操作图标将自动返回到图标列表中去，如图10.8所示。 所有图标拖放操作全部正确后，右边的图标列表区将完全清空。 10.3 项目制作说明 三、项目制作说明 1、本项目由两个场景构成，一是“十大产业集群”，二是“互动游戏”。 2、场景1图层功能说明。场景中共包含6个图层（组），如图10.9所示。 互动游戏：此图层中放置的是一个按钮，功能为点此按钮将程序引导至场景2。 上下栏：此图层是界面上下栏及右边的文字，地图将在此栏下方活动。 弹出窗口：此图层包含了三个弹出窗口内容及三个关闭窗口按钮。 点击弹出窗口：此图层组下面仅有一个图层，内容为三个放大镜。 地图：此图层中包含一个高分辩率的完整的成都地图。此地图可进行缩放操作。 第一二三圈地图：此图层组下面包含有三个图层，分别对应三圈层地图。 大背景：此图层是整个项目的背景层，包含有一个蓝色的背景。同时，里面也有部分脚本语句。 3、场景2图层功能说明。场景2中共包含有3个图层，如图10.10所示。 提示文字：本图层中包含了图标操作正确和错误后的提示信息。 各目标区：本图层中包含了所有目标区。目标区使用PNG图片，背景透明，并将各PNG图片本身的透明度也全部设置成0，这样，在界面中，将包含此目标区域，但又看不见区域本身。 背景：本图层包含有背景图片及脚本语句。 4、外部动画。本项目最终展示中，调用了几个外部动画文件。其中bg.swf、bg2.swf、bg3.swf三个文件是动态光影效果，ts.swf是天使动画。在程序中，我们使用loadMovie（）函数将外部flash动画文件载入至程序中。 10.4 具体制作 1、创建新的ActionScript 2.0文档，并将文档尺寸设置为1280*768像素，帧率设置成30FPS。 2、在“背景”图层中导入图片“大背景.jpg”，并将帧延长至48帧。然后在第49帧创建一个关键帧，再将帧延长至第55帧。选中第1帧，然后按下F9，在动作面板中输入以下代码： this.createEmptyMovieClip(aa,4);//先创建一个空mc名为aa，放在第4层 loadMovie(bg.swf, aa);//载入外部动画bg.swf，并放到aa里 this.aa._x = 180;//设置aa的坐标位置 this.aa._y = 150; this.aa._xscale = 100;//设置aa的比例 this.aa._yscale = 100; this.createEmptyMovieClip(bb,5); loadMovie(bg2.swf,