[原创]FLASH中的纯AS移动方法系列基础教程和实例集锦一(适合新手)
特为朋友张良安而写,希望对其他朋友也有所用.
FLASH中的纯AS移动方法基础教程和实例集锦(适合新手),欢迎转载,敬请注明来源--闪吧和作者--sxl001,QQ:285510591
在此只探讨用AS语句去控制移动的方法。FLASH中能够移动的物体一般是舞台上的电影实例（以下简称为MC，其实例名为my_mc）。FLASH中物体的移动是在X轴（即水平）方向或Y轴（垂直）方向的运动。因此，通过控制mc属性中的_x与_y的值就可以达到使其运动的目的。以下代码只是粗略解释,如需要详细解释可自行查阅帮助文件或与本人交流。
一、匀速运动
1、水平方向上的向右匀速运动
方法一:
主场景第1帧：var mx=5;//初始速度值5
主场景第2帧：my_mc._x+=mx;//my_mc的x坐标增加5(即向右每次运动的幅度为5)
主场景第3帧：gotoAndPlay(2);//返回第2帧，形成不断向右运动的效果。
(见实例匀速运动1_1_1)
 匀速运动1_1_1.swf (2.06 KB)
匀速运动1_1_1.fla (13.5 KB)
方法二:
主场景第1帧：
var mx = 5;//初始速度值5
this.onEnterFrame = function() {//指明当前时间轴this上onEnterFrame 事件处理函数，以 SWF 文件的帧频重复调用
my_mc._x += mx;//my_mc的x坐标增加5(即向右每次运动的幅度为5)
};
(见实例匀速运动1_1_2_1)
匀速运动1_1_2_1.swf (2.17 KB)
匀速运动1_1_2_1.fla (15.5 KB)
或者：
var mx = 5;//初始速度值5
onEnterFrame = function () { //onEnterFrame 事件处理函数定义一个函数,
//以 SWF 文件的帧频重复调用以下my_mc的坐标不断向右运动
my_mc._x += mx;
};
(见实例匀速运动1_1_2_2)
匀速运动1_1_2_2.swf (2.27 KB)
匀速运动1_1_2_2.fla (15.5 KB)
或者：
var mx = 5;
my_mc.onEnterFrame = function() {
this._x += mx;
};//(见实例匀速运动1_1_2_3)
匀速运动1_1_2_3.swf (2.25 KB)
匀速运动1_1_2_3.fla (11 KB)
方法三:
主场景my_mc上：
onClipEvent (load) {
var mx = 5;
}
onClipEvent (enterFrame) {
_x += mx;
}//(见实例匀速运动1_1_3_1)
匀速运动1_1_3_1.swf (2.14 KB)
匀速运动1_1_3_1.fla (15 KB)
方法四:
主场景第1帧：
function moveToRight(Object, xVar) {
var mx = xVar;
onEnterFrame = function () {
Object._x += mx;
};
}
moveToRight(my_mc, 5);
//(见实例匀速运动1_1_4_1)
匀速运动1_1_4_1.swf (2.13 KB)
匀速运动1_1_4_1.fla (10.5 KB)
方法五:
MovieClip.prototype.mcmove = function(Object, x) {
var mx = x;
onEnterFrame = function () {
Object._x += mx;
};
};
mcmove(my_mc, 5);//(见实例匀速运动1_1_5_1)
匀速运动1_1_5_1.swf (2.19 KB)
匀速运动1_1_5_1.fla (10.5 KB)
1、垂直方向上的向下匀速运动
以上实例的运动方向都是水平从左向右匀速运动，如果需要垂直方向上的向下匀速运动只需要把MC的_x属性改为_y。
如：
var my = 5;
this.onEnterFrame = function() {
my_mc._y += my;
};//(见实例匀速运动1_2_01)
匀速运动1_2_01.swf (2.16 KB)
匀速运动1_2_01.fla (12.5 KB)
MovieClip.prototype.mcmove = function(Object, y) {
var my = y;
onEnterFrame = function () {
Object._y += my;
};
};
mcmove(my_mc, 5);
//(见实例匀速运动1_2_02)
匀速运动1_2_02.swf (2.21 KB)
匀速运动1_2_02.fla (15 KB)
2、水平方向上的向左匀速运动
水平方向上的向左匀速运动，只需要将上述实例1_系列中的变量var mx=5;更改为var mx=-5;或者，将my_mc._x += mx;更改为my_mc._x -= mx;
如：
var mx = -5;
my_mc._x = 524;//初始my_mc的x坐标。
this.onEnterFrame = function() {
my_mc._x += mx;
};//(见实例匀速运动1_3_01)
匀速运动1_3_01.swf (2.29 KB)
匀速运动1_3_01.fla (15.5 KB)
或者：
var mx = 5;
my_mc._x = 524;//初始my_mc的x坐标。
this.onEnterFrame = function() {
my_mc._x -= mx;
};//(见实例匀速运动1_3_02)
匀速运动1_3_02.swf (2.34 KB)
匀速运动1_3_02.fla (18.5 KB)
3、垂直方向上的向上匀速运动
垂直方向上的向下匀速运动更改为向上的匀速运动时，方法同“3、水平方向上的向左匀速运动。”
如：
var my = 5;
my_mc._y = 370;
this.onEnterFrame = function() {
my_mc._y -= my;
};//(见实例匀速运动1_4_01)
匀速运动1_4_01.swf (2.12 KB)
匀速运动1_4_01.fla (10 KB)
4、斜方向上的匀速运动
如：
var mx = 5, my = 3;
my_mc._x = 0;
my_mc._y = 370;
this.onEnterFrame = function() {
my_mc._x += mx;
my_mc._y -= my;
};//(见实例匀速运动1_5_01)
匀速运动1_5_01.swf (2.05 KB)
匀速运动1_5_01.fla (15 KB)
精确起终点代码版：
var k = 200;
//速率
var startx = my_mc._x=0, starty = my_mc._y=400;
//起点坐标
var endx = 550, endy = 0;
//终点坐标
onEnterFrame = function () {
my_mc._x += (endx-startx)/k;
my_mc._y += (endy-starty)/k;
};//(见实例匀速运动1_5_02)
匀速运动1_5_02.swf (2.2 KB)
匀速运动1_5_02.fla (15 KB)
5、在一定范围内的来回匀速运动
⑴水平来回：
var startx = my_mc._x=50;
//startx起点位置
var endx = 450;
//endx结束位置
var dis = 100;
//dis速率
var disx = (endx-startx)/dis;
var disy = (endy-starty)/dis;
var k0 = k=1;
//k方向系数
onEnterFrame = function () {
if (my_mc._x>=endx) {
k = -k;
}
if (my_mc._x<=startx) {
k = k0;
}
my_mc._x += disx*k;
my_mc._y += disy*k;
};//(见实例匀速运动1_6_01)注：垂直来回方法相似
匀速运动1_6_01.swf (2.44 KB)
匀速运动1_6_01.fla (15.5 KB)
⑵斜向来回:
var k0 = k=1;
var dis = 200;
//dis速率
var startx = my_mc._x=50, starty = my_mc._y=300;
//起点坐标
var endx = 450, endy = 50;
//终点坐标
var disx = (endx-startx)/dis;
var disy = (endy-starty)/dis;
onEnterFrame = function () {
if (my_mc._x<=startx) {
k = k0;
}
if (my_mc._x>=endx) {
k = -k;
}
my_mc._x += disx*k;
my_mc._y += disy*k;
};//(见实例匀速运动1_6_02)
匀速运动1_6_02.swf (2.4 KB)
匀速运动1_6_02.fla (15.5 KB)
二、变速运动
1、水平方向上的变速运动
⑴减速运动
方法一:
主场景第1帧：
var endPosition = 500;
var k = 12;
my_mc._x = 50;
my_mc._y = 200;
主场景第2帧：my_mc._x += (endPosition-my_mc._x)/k;
主场景第3帧：
gotoAndPlay(2);
if (my_mc._x>=(endPosition-0.6)) {
my_mc._x = endPosition;
stop();
}
//(见实例减速运动2_1_1_01)
减速运动2_1_1_01.swf (2.29 KB)
减速运动2_1_1_01.fla (15 KB)
方法二:
var endPosition = 475;
var k = 12;
my_mc._x = 50;
my_mc._y = 200;
onEnterFrame = function () {
my_mc._x += (endPosition-my_mc._x)/k;
if (my_mc._x>(endPosition-1)) {
my_mc._x = endPosition;
delete onEnterFrame;
}
};//(见实例减速运动2_1_1_02)
减速运动2_1_1_02.swf (2.27 KB)
减速运动2_1_1_02.fla (12.5 KB)
如果要实现从右向左运动时，只需要稍改上述的实例减速运动2_1_1_02
var endPosition = 50;
var k = 12;
my_mc._x = 550;
my_mc._y = 200;
onEnterFrame = function () {
trace(my_mc._x);
my_mc._x += (endPosition-my_mc._x)/k;
if (my_mc._x<=endPosition) {
my_mc._x = endPosition;
delete onEnterFrame;
}
};(见实例减速运动2_1_1_03)
减速运动2_1_1_03.swf (2.38 KB)
减速运动2_1_1_03.fla (12.5 KB)
特别说明：上述的减速运动代码可广泛运用于实际中，它不仅可用于向上、下、左、右、斜向各个方向上的运动，产生缓冲效果。也可以运用于透明度和缩放等方面。如下面的两个例子。
另一个减速缓冲效果：
var endPosition = 500;
var k = 0.7;
var c = 0.2;
my_mc._x = 10;
my_mc._y = 200;
onEnterFrame = function () {
temp = temp*k+(endPosition-my_mc._x)*c;//此公式常用
my_mc._x += Math.round(temp);
if (Math.round(temp) == 0) {
my_mc._x = endPosition;
delete onEnterFrame;
}
};
(见实例减速运动2_1_1_04)
减速运动2_1_1_04.swf (2.37 KB)
减速运动2_1_1_04.fla (12.5 KB)
透明度上的运用：
var endAlpha = 10;
var k = 5;
my_mc._alpha = 100;
onEnterFrame = function () {
my_mc._alpha += (endAlpha-my_mc._alpha)/k;
if (my_mc._alpha<=endAlpha) {
my_mc._alpha = endAlpha;
delete onEnterFrame;
}
};(见实例透明度上的缓冲运用2_1_1_05)
透明度上的缓冲运用2_1_1_05.swf (3.09 KB)
透明度上的缓冲运用2_1_1_05.fla (10.5 KB)
缩放上的运用：
var endscale = 600;
var k = 6;
my_mc._xscale = my_mc._yscale=1;
onEnterFrame = function () {
trace(my_mc._yscale);
my_mc._xscale = my_mc._yscale += (endscale-my_mc._yscale)/k;
if (my_mc._yscale>=(endscale-0.1)) {
my_mc._yscale = endscale;
delete onEnterFrame;
}
};(见实例缩放上的缓冲运用2_1_1_06)
缩放上的缓冲运用2_1_1_06.swf (3.04 KB)
缩放上的缓冲运用2_1_1_06.fla (12.5 KB)
[ 本帖最后由 sxl001 于 2006-10-9 16:37 编辑 ] |
发表于 2006-9-30 16:07
| 
发表于 2006-10-2 13:11
| 