Flash交互变色按钮制作教程

想用Flash制作一组有交互感的变色按钮吗？

其实原理并不复杂。下面这个分步教程，将带你从零开始，实现鼠标经过时按钮变色、移开则恢复原状的效果。

整个过程清晰明了，我们这就开始。

第一步：新建文档

打开软件，新建一个Flash文档。

第二步：制作基础按钮元件

使用矩形工具结合文本工具制作一个影片剪辑，如图所示。这个剪辑将作为我们按钮的基础形态。

第三步：编辑变色动画

双击进入编辑，制作一个变色的动画效果，或者其它的动画效果。这里我们以简单的颜色变化为例。

第四步：控制动画播放

新建一个图层，在第1帧和最后1帧都放入代码 “stop();”。

这能确保动画不会自动循环播放，而是停留在初始状态。

第五步：制作更多按钮

用同样的方法，再制作两个一级按钮元件出来。这样我们就有了三个独立的按钮元件。

第六步：设置按钮实例名

分别设置这三个按钮元件的实例名为 btn0, btn1, btn2。

给它们起好名字，后续的代码控制才能准确找到目标。

第七步：准备添加交互代码

现在添加代码来实现鼠标经过的功能。

在主时间轴右键选择“动作”，打开动作面板，准备编写交互逻辑。

第八步：输入交互代码

输入如图代码。

这段代码的核心是监听鼠标事件：

• 当鼠标移入某个按钮时，播放其变色动画；
• 当鼠标移出时，则让动画跳回并停止在第一帧，也就是恢复原状。

第九步：测试效果

测试一下效果。

现在你应该能看到：

• 鼠标经过按钮时它会发生变化；
• 当鼠标移到其他按钮上时，之前变色的按钮又会智能地恢复原状。

一个简洁的交互效果就这样完成了。

《夸克》非常好用的免费AI浏览器

下载APP查看