Flex Builder和Flash CS4一个地图.docVIP

结合Flex Builder和Flash CS4制作一个中国地图的应用 地图 郭少瑞 这篇文章，我们将了解到如何使用Flash技术创建一个中国地图的应用。相信在很多地方都会有这样的需求：比如一个全国性论坛的入口，需要显示一种导航给访客，让访客可以选择自己的省份，这种情况下最方便的方式就是提供一个具备交互特性的地图给用户，同样也可以很方便的用这个地图展示一些数据（比如每个区域的注册人数等等），那么选用何种技术来制作这个应用呢？当然是Flash，基于Flash Player平台我们可以创建非常酷的具备很强交互性的应用（这里所说的Flash是指Flash Platform，即Flash平台，而非指单独的某个软件）。 问题概述： 我想使用Flash制作一个中国地图的应用，这个应用应该按照省份划分出若干区域，并可以响应单独的鼠标事件，并且可以实时的显示一些信息等等，功能可以归结如下： 按照省份划分行政区域，显示每个省份的详细信息（内容通过XML自定义） 支持HTML显示 支持点击省份，打开网页链接 支持事件监听（ActionScript和JavaScript） 最终完成的运行效果如下： /Files/demo.html 解决方案： 我们可以先使用Flash CS4完成地图的基本绘制，然后使用Flex Builder来完成逻辑的编写工作，这是一个很典型的结合Flash创作工具和Flex编码工具的一个应用场景，众所周知的是FlashCS在动画和矢量图形的绘制上非常强悍，但它并不是一个完善的开发工具，虽然你也可以使用Flash CS完成全部代码的编写工作（这是完全可以的，如果你有足够的耐心忍受Flash CS在编码支持上的缺陷的话），但如果有更为强大的Flex Builder（最新版已经改名为Flash Builder了，因为最新版是测试版，所以我们这里仍然以Flex Builder3为例来完成这个应用）来帮你更高效的工作，我们为什么不选择Flex Builder呢？这里我们将把Flash CS4和Flex Builder3结合起来完成这个工作。 注意在这里我们只是使用了Flex Builder3这个IDE，而并没有使用Flex技术（即Flex的框架），所以我在标题刻意表明了Flex Builder，而非Flex，以防误解。 使用软件： Flex Builder3，Flash CS4 详细步骤： 1.准备工作 首先你需要寻找关于中国地图的素材，最好是矢量的，以便可以很方便的在Flash中使用，你也可以从文章最后的源码部分，下载到项目中的地图素材文件 2.使用Flash CS4完成地图的绘制 使用FlashCS4完成整个地图的绘制工作，这个部分的工作比较枯燥，但如果你的项目对UI细节的把控很严格，这个地方的工作也是要细心完成的，需要特别注意的是，要将省份分割成为若干独立的电影剪辑，以便分散侦听它们的鼠标事件，具体的源文件的结构可以参考源码中的assets目录中的map.fla文件，注意有3个电影剪辑是需要设置导出为类的（在电影剪辑的属性面板中，点开“高级选项”即可看到），如下图所示： 这一步很关键，因为在Flex Builder中编程的时候，我们需要把这些素材作为类来使用。绘制工作完成之后，我们需要打开Flash属性面板上的“发布设置”面板，选中“导出SWC文件”，这个操作的含义就是我们将把资源导出到一个SWC资源包，以便我们之后使用。完成这部操作之后，我们就可以按下F12键，发布一个SWC文件出来（有过Flex编程经验的朋友肯定对这个格式不陌生了），至此Flash CS部分的工作结束，下面我们转入Flex Builder继续后续的编程工作。 3.建立Action Script项目并导入SWC文件 我们打开Flex Builder，建立一个Action Script项目（因为我们并不需要Flex的框架，所以没必要引入MXML），然后在项目的Library部分，导入我们刚才导出的SWC文件（这个时候，你可以在项目中使用New语句测试一下，就会发现语法提示中已经出现了刚才我们导出到SWC中的地图类）。 4.建立数据XML文件 刚才已经提到，我们这个地图将使用XML作为数据来源，我们可以按照如下的结构建立一个XML，示例地址： /p/chinamapforflash/source/browse/trunk/src/data/d.xml 5.完成功能编写 我们会发现，Flex Builder已经为我们建立了一个主程序的类文件，也就是默认的编译文件，我们可以直接在它的基础上编写代码。首先使用元数据（Metadata）设置一下编译的参数： [SWF(width=600,height=500,frameRate=25,backgroundColo