FLASH中的移动方法教程和实例集锦(适合新手)
2008-04-10 23:32
405 查看
在此只探讨用AS语句去控制移动的方法。FLASH中能够移动的物体一般是舞台上的电影实例(为节省篇幅以下简称为MC,并且其实例名为my_mc)。 FLASH中物体的移动是在X轴(即水平)方向或Y轴(垂直)方向的运动。因此,通过控制mc属性中的_x与_y的值就可以达到使其运动的目的。
一、匀速运动
1、水平方向上的向右匀速运动
方法一:
主场景第1帧:
var mx=5;//设定初始速度为5
主场景第2帧:
my_mc._x+=mx;//名称为my_mc的电影实例以步幅5的速度向右移动
主场景第3帧:
gotoAndPlay(2);// 跳转到第二帧,再次激发my_mc电影实例以步幅5的速度向右移动后又会跳转到此帧,并再次激发运动,如此周而得始地激发,就达到了不断向右运动的目的.
见实例:
匀速运动1_1_1.rar
方法二:
主场景第1帧:
var mx = 5;//设定初始速度为5
this.onEnterFrame = function() {
my_mc._x += mx;//不断刷新my_mc的向右运动
};
//方法一需要3帧才能运动,而此方法二只需要一帧就可以使其运动,这是主要区别
见实例:
匀速运动1_1_2_1.rar
或者:
var mx = 5;//初始速度值为5
onEnterFrame = function () {
my_mc._x += mx;
};
//此方法三与方法二的区别在于,方法二中this.onEnterFrame中的this是指当前时间轴;而在此方法三中直接用onEnterFrame,并未用this时,就表示暗指当前时间轴.
见实例:
匀速运动1_1_2_2.rar
或者:
var mx = 5;//初始速度值5
my_mc.onEnterFrame = function() {
this._x += mx;
};//此处的my_mc.onEnterFrame指方法是加在my_mc上的.
见实例:
匀速运动1_1_2_3.rar
方法三:
主场景my_mc上:
onClipEvent (load) {
var mx = 5;//初始速度值5
}
onClipEvent (enterFrame) {
_x += mx;//触发my_mc实例定义的动作是x轴坐标不断增值5。
}
见实例:
匀速运动1_1_3_1.rar
方法四:
主场景第1帧:
function moveToRight(Object, xVar) {//定义函数的方法
var mx = xVar;
onEnterFrame = function () {
Object._x += mx;
};
}
moveToRight(my_mc, 5);
见实例:
匀速运动1_1_4_1.rar
方法五:
MovieClip.prototype.mcmove = function(Object, x) {
var mx = x;
onEnterFrame = function () {
Object._x += mx;
};
};
mcmove(my_mc, 5);
见实例:
匀速运动1_1_5_1.rar
1、垂直方向上的向下匀速运动
以上实例的运动方向都是水平从左向右匀速运动,如果需要垂直方向上的向下匀速运动只需要把MC的_x属性改为_y。如:
var my = 5;
this.onEnterFrame = function() {
my_mc._y += my;
};
见实例:
匀速运动1_2_01.rar
或者:
MovieClip.prototype.mcmove = function(Object, y) {
var my = y;
onEnterFrame = function () {
Object._y += my;
};
};
mcmove(my_mc, 5);
见实例:
匀速运动1_2_02.rar
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.rar
或者:
var mx = 5;
my_mc._x = 524;//初始my_mc的x坐标。
this.onEnterFrame = function() {
my_mc._x -= mx;
};
见实例:
匀速运动1_3_02.rar
3、垂直方向上的向上匀速运动
垂直方向上的向下匀速运动更改为向上的匀速运动时,方法同“3、水平方向上的向左匀速运动。”如:
var my = 5;
my_mc._y = 370;
this.onEnterFrame = function() {
my_mc._y -= my;
};
见实例:
匀速运动1_4_01.rar
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.rar
精确起终点代码版:
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.rar
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.rar (注:垂直来回方法相似)
⑵斜向来回:
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.rar
二、变速运动
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.rar
方法二:
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.rar
如果要实现从右向左运动时,只需要稍改上述的实例减速运动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.rar
特别说明:上述的减速运动代码可广泛运用于实际中,它不仅可用于向上、下、左、右、斜向各个方向上的运动,产生缓冲效果。也可以运用于透明度和缩放等方面。如下面的两个例子。另一个减速缓冲效果:
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;//此公式常用 ,k和c的值不能为正,记住公式即可
my_mc._x += Math.round(temp); //round()这个函数是取整的,遵循四舍五入原则
if (Math.round(temp) == 0) {
my_mc._x = endPosition;
delete onEnterFrame;
}
};
见实例:
减速运动2_1_1_04.rar
透明度上的运用:
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.rar
缩放上的运用:
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.rar
补充研究 http://bbs.blueidea.com/thread-1894636-1-1.html http://flashcoder.cn/blog/?p=49
一、匀速运动
1、水平方向上的向右匀速运动
方法一:
主场景第1帧:
var mx=5;//设定初始速度为5
主场景第2帧:
my_mc._x+=mx;//名称为my_mc的电影实例以步幅5的速度向右移动
主场景第3帧:
gotoAndPlay(2);// 跳转到第二帧,再次激发my_mc电影实例以步幅5的速度向右移动后又会跳转到此帧,并再次激发运动,如此周而得始地激发,就达到了不断向右运动的目的.
见实例:
匀速运动1_1_1.rar
方法二:
主场景第1帧:
var mx = 5;//设定初始速度为5
this.onEnterFrame = function() {
my_mc._x += mx;//不断刷新my_mc的向右运动
};
//方法一需要3帧才能运动,而此方法二只需要一帧就可以使其运动,这是主要区别
见实例:
匀速运动1_1_2_1.rar
或者:
var mx = 5;//初始速度值为5
onEnterFrame = function () {
my_mc._x += mx;
};
//此方法三与方法二的区别在于,方法二中this.onEnterFrame中的this是指当前时间轴;而在此方法三中直接用onEnterFrame,并未用this时,就表示暗指当前时间轴.
见实例:
匀速运动1_1_2_2.rar
或者:
var mx = 5;//初始速度值5
my_mc.onEnterFrame = function() {
this._x += mx;
};//此处的my_mc.onEnterFrame指方法是加在my_mc上的.
见实例:
匀速运动1_1_2_3.rar
方法三:
主场景my_mc上:
onClipEvent (load) {
var mx = 5;//初始速度值5
}
onClipEvent (enterFrame) {
_x += mx;//触发my_mc实例定义的动作是x轴坐标不断增值5。
}
见实例:
匀速运动1_1_3_1.rar
方法四:
主场景第1帧:
function moveToRight(Object, xVar) {//定义函数的方法
var mx = xVar;
onEnterFrame = function () {
Object._x += mx;
};
}
moveToRight(my_mc, 5);
见实例:
匀速运动1_1_4_1.rar
方法五:
MovieClip.prototype.mcmove = function(Object, x) {
var mx = x;
onEnterFrame = function () {
Object._x += mx;
};
};
mcmove(my_mc, 5);
见实例:
匀速运动1_1_5_1.rar
1、垂直方向上的向下匀速运动
以上实例的运动方向都是水平从左向右匀速运动,如果需要垂直方向上的向下匀速运动只需要把MC的_x属性改为_y。如:
var my = 5;
this.onEnterFrame = function() {
my_mc._y += my;
};
见实例:
匀速运动1_2_01.rar
或者:
MovieClip.prototype.mcmove = function(Object, y) {
var my = y;
onEnterFrame = function () {
Object._y += my;
};
};
mcmove(my_mc, 5);
见实例:
匀速运动1_2_02.rar
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.rar
或者:
var mx = 5;
my_mc._x = 524;//初始my_mc的x坐标。
this.onEnterFrame = function() {
my_mc._x -= mx;
};
见实例:
匀速运动1_3_02.rar
3、垂直方向上的向上匀速运动
垂直方向上的向下匀速运动更改为向上的匀速运动时,方法同“3、水平方向上的向左匀速运动。”如:
var my = 5;
my_mc._y = 370;
this.onEnterFrame = function() {
my_mc._y -= my;
};
见实例:
匀速运动1_4_01.rar
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.rar
精确起终点代码版:
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.rar
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.rar (注:垂直来回方法相似)
⑵斜向来回:
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.rar
二、变速运动
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.rar
方法二:
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.rar
如果要实现从右向左运动时,只需要稍改上述的实例减速运动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.rar
特别说明:上述的减速运动代码可广泛运用于实际中,它不仅可用于向上、下、左、右、斜向各个方向上的运动,产生缓冲效果。也可以运用于透明度和缩放等方面。如下面的两个例子。另一个减速缓冲效果:
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;//此公式常用 ,k和c的值不能为正,记住公式即可
my_mc._x += Math.round(temp); //round()这个函数是取整的,遵循四舍五入原则
if (Math.round(temp) == 0) {
my_mc._x = endPosition;
delete onEnterFrame;
}
};
见实例:
减速运动2_1_1_04.rar
透明度上的运用:
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.rar
缩放上的运用:
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.rar
补充研究 http://bbs.blueidea.com/thread-1894636-1-1.html http://flashcoder.cn/blog/?p=49
相关文章推荐
- Flash新手入门教程:实例讲解引导层的应用
- OC 移动开发新手常用方法的汇总(含代码实例)
- flash常见问题集锦,很适合新手哦[二]
- CentOS系统 Amoeba+MySql主从读写分离配置 适合新手傻瓜式教程!-----仅供参考!
- JavaScript强化教程——DOM编程(两种控制div移动的方法)
- emWin 2天速成实例教程001_GUIBuilder的使用方法
- Silverlight+WCF 新手实例 象棋 棋子移动-规则[将、马、士、相、炮](八)
- JS入门基本教程(适合没编程基础新手)
- 适合新手小白的Git使用教程(一)
- 适合新手小白的Git使用教程(三)
- ASP.NET MVC4 新手入门教程之九 ---9.查询详情和删除方法
- 赛迪Symbian-OS-C++移动开发与实例视频教程
- emWin 2天速成实例教程009_ListView列表框控件使用方法
- 在JavaScript中重写jQuery对象的方法实例教程
- 笨且简单方法,从U盘启动安装Centos-----仅适合新手
- emWin 2天速成实例教程016_不规则异形进度条控件实现方法
- emWin 2天速成实例教程011_Multipage多页控件使用方法
- C#基础之匿名方法实例教程
- U3D关于物体移动的方法的实例
- Dreamweaver & Flash & Photoshop网页设计基础与实例教程(职业白金版)