鼠标效果系列教程：简单跟随 -pc6资讯

您的位置：首页 → 网页设计 → Flash → 鼠标效果系列教程：简单跟随

鼠标效果系列教程：简单跟随 时间：2004/11/7 2:25:00来源：本站整理作者：蓝点我要评论(0)

概述

　　鼠标跟随的效果可谓千变万化，但是万变不离其宗，掌握了最基本的做法，再做其它更复杂的，也就相对容易了。当然，要做出真正漂亮的作品，丰富的想象力也是必不可少的。在下面的几节中，我们就由浅入深的讨论一下鼠标跟随的具体实现方法。

　　先来看看鼠标跟随的理论基础。最基本的就是获取跟随物体和鼠标的位置。

一、获取跟随物体的位置

　　用_x和_y这对属性来获取场景中实例的当前位置，这个大家应该非常熟悉了，_x和_y的值表示以场景的左上角为原点，向右为X轴正向，向下为Y轴正向的坐标系中，实例的坐标值。这里提到的，就是Flash的主坐标系统。而对于影片剪辑，它们还有各自独立的，以自己的中心为原点的坐标系统。弄清楚这一点，对于以后的编程很重要。如图1所示。

图1

二、获取鼠标的位置

　　鼠标的位置，可以用_xmouse和_ymouse这对属性来获取。这时就要注意坐标系统的区别了。对于某个影片剪辑的_xmouse和_ymouse属性，其值是以其自身的坐标系统为基础的。例如图1中，影片剪辑“mc”的位置是(200,200)，当鼠标位于A点(100,100)时，mc._xmouse= -100，mc._ymouse= -100。

三、鼠标跟随的算法

　　有了上面的这些理论基础，接下来就是实现跟随的算法了。介绍一种最常用的算法：带有加速度的跟随。大概的思路是这样，算出当前实例和鼠标之间的距离，比如是100，设定一个百分比，比如50%，使该实例向鼠标移动这段距离的50%，100*50%=50，这样它和鼠标的距离就还有50。接着，再让它移动当前距离的50%，这次是50*50%=25。重复这样做，最后实际的结果就是，第一次，移动了50，第二次是25，第三次是12.5，……这样就模拟了物体向着目标开始快、越靠近越慢的减速运动的过程。

　　我们就用这个算法做个简单的跟随效果。

制作步骤

一、制作跟随图案

　　打开Flash　MX，新建文件，新建一个影片剪辑，设计制作一个图案放入第一帧。如图2所示。

图2

二、编写动作

　　点选这一帧，打开动作面板，加入如下语句：

A = 8; // 调节A的值可改变跟随速度
this._x = this._x+_xmouse/A;
this._y = this._y+_ymouse/A;

　　注意，因为这段语句是加在影片剪辑中的，所以这里的_xmouse和_ymouse的值就等于影片剪辑和鼠标之间的矢量距离。为什么？再回过头去看看关于影片剪辑自身的坐标系统的理论就明白了。this._x = this._x+_xmouse/A就使MC向鼠标移动了它们之间X轴方向距离的八分之一，同理，this._y = this._y+_ymouse/A一句控制Y轴方向的运动。好，程序就是这么简单！

三、制作循环

　　接下来，在第二帧，按F6增加一个关键帧。这一帧主要是在影片剪辑内构成一个循环，使第一帧的程序能够不断的被执行。

　　最后，把做好的影片剪辑拖入场景中就行了。按Ctrl+Enter测试一下，是不是很有成就感？

图3