如何用Flash制作炫酷的鼠标跟随效果 —— 创意动画教程

在数字媒体设计领域，Flash曾一度被视为动画创作的重要工具，尽管现在HTML5等技术逐渐取代了Flash的地位，但Flash中的许多设计理念和技巧仍然值得我们学习与借鉴，我们就来探讨一下如何使用Flash制作一个简单的、却极具视觉吸引力的功能——鼠标跟随效果，这个功能不仅能够增加网页的互动性，还能为你的作品增添一抹独特的色彩，无论你是初学者还是有一定经验的设计者，都能从中学到一些实用的知识。

准备工作

在开始之前，请确保你已经安装了Adobe Animate CC（即Flash的更新版本），如果你还在使用旧版Flash软件，也可以尝试着操作，不过可能会遇到一些界面或功能上的差异，还需要准备一张你喜欢的图片作为“跟随”对象，这张图片将会随着鼠标的移动而变化位置。

创建新文档

打开Adobe Animate CC后，点击菜单栏中的“文件”>“新建”，选择适合你项目需求的文档类型，对于本教程，我们可以选择“Flash（.swf）”格式，并设置合适的作品尺寸，比如640x480像素。

导入素材

将事先准备好的图片素材导入到库中，方法是在菜单栏选择“文件”>“导入”>“导入到库”，然后找到你的图片文件并打开它，这样，该图片就会出现在软件右侧的“库”面板里了。

添加图层

为了更好地组织我们的元素，我们需要在时间轴上添加新的图层，右键点击现有的图层，在弹出菜单中选择“插入图层”，我们通常会为每一个独立的对象创建一个单独的图层，以便于管理。

插入图片

把库里的图片拖拽到舞台中央的位置，这时候你会发现图片默认是居中显示的，如果需要调整大小或者旋转角度，可以使用属性面板中的相应选项进行微调。

设置动作脚本

为了让图片能够跟随鼠标移动，我们需要编写一点ActionScript代码，虽然这听起来可能有点吓人，但实际上非常简单！

1、双击舞台上的图片，将其转换成影片剪辑元件。

2、在弹出的“转换为元件”对话框中命名你的影片剪辑，例如命名为“followMe”。

3、右键点击舞台上的影片剪辑实例，选择“编辑”进入元件编辑模式。

4、在新的空白图层上绘制一个小点或者圆形，作为检测鼠标位置的“热点”。

5、返回主场景，选中场景1的第一帧。

6、打开动作面板（窗口>动作），输入以下代码：

import flash.events.MouseEvent;
this["followMe"].addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
function onMouseMove(event:MouseEvent):void {
    var mc:MovieClip = this["followMe"];
    mc.x = event.stageX;
    mc.y = event.stageY;
}

这段代码的作用是监听鼠标移动事件(MouseEvent.MOUSE_MOVE)，并通过事件对象获取当前鼠标的坐标值，然后将这些坐标值赋给影片剪辑元件followMe的位置属性，从而实现跟随效果。

测试与发布

完成以上步骤后，别忘了保存你的工作，你可以通过点击菜单栏中的“控制”>“测试影片”来预览效果，如果一切正常，那么恭喜你，你已经成功地制作出了一个基本的鼠标跟随效果！

如果你想将这个作品分享给他人或发布到网络上，只需要导出SWF文件即可，选择“文件”>“导出”>“导出影片”，在弹出的对话框中设置相关参数，并指定保存路径，这样，任何人都可以通过浏览器欣赏到你精心设计的互动动画啦！

就是利用Flash（Animate CC）实现鼠标跟随效果的全部过程，希望这篇教程能够帮助到正在学习或想要尝试这方面创作的朋友们，实践是最好的老师，多动手尝试不同的设置组合，或许能带给你更多灵感与惊喜哦！