flash与动画：排斥互换

Flash动画菜单交互

最新推荐文章于 2022-04-24 20:28:51 发布

转载最新推荐文章于 2022-04-24 20:28:51 发布 · 66 阅读

本文介绍了一个使用Flash制作的动画菜单案例，通过Tween动画实现了菜单项的动态效果。具体包括菜单项点击后向下移动的动画效果及菜单间的互斥操作，确保每次只有一个菜单处于激活状态。

需求一：

有一个这样的需求动画，有一行的菜单MC，当你点击了第一个菜单后，则向下移动，当你点击这个本身的菜单的时候则返回。

import fl.transitions.Tween; import fl.transitions.easing.*; var list:Array=[]; //创建五个MC for (var i:int=0; i<5; i++) { var shape:MovieClip =new MovieClip(); addChild(shape); shape.graphics.beginFill(0x999999); shape.graphics.drawRect(0,0,100,100); shape.x=i*shape.width+i*10; shape.y=50; shape.isMove=false; list.push(shape); shape.addEventListener(MouseEvent.CLICK,onClick); } //排斥互换，当存在一个已经移动的mc的时候，再点击其他mc，需要对其进行切换返回原来的位置 function onClick(event:MouseEvent):void { var shape:MovieClip=event.currentTarget as MovieClip; var tween:Tween; if (shape.isMove==false) { shape.isMove=true; tween=new Tween(shape,"y",Strong.easeOut,50,150,31,false); } else { shape.isMove=false; tween=new Tween(shape,"y",Strong.easeOut,150,50,31,false); } }

我们使用循环创建5个MC，并添加鼠标监听行为，并为他添加一个动态属性isMove，这个属性可以判断到他是否鼠标点击后向下移动了。

默认是false值，一旦点击了之后就可以变成true。

通过判断组合，开关器组合方式来实现这种点击之后动画。

if（key）

{

key=false；

}

else

{

key=true；

}

需求二：

有一个这样的需求动画，有一行的菜单MC，当你点击了第一个菜单后，则向下移动，当你点击这个本身的菜单的时候则返回。

当点击了其他菜单的时候，如果存在已经向下移动过的菜单则需要返回原先的位置。每次向下移动的时候，只允许一个。

import fl.transitions.Tween; import fl.transitions.easing.*; var list:Array=[]; //创建五个MC for (var i:int=0; i<5; i++) { var shape:MovieClip =new MovieClip(); addChild(shape); shape.graphics.beginFill(0x999999); shape.graphics.drawRect(0,0,100,100); shape.x=i*shape.width+i*10; shape.y=50; shape.isMove=false; list.push(shape); shape.addEventListener(MouseEvent.CLICK,onClick); } //排斥互换，当存在一个已经移动的mc的时候，再点击其他mc，需要对其进行切换返回原来的位置 function onClick(event:MouseEvent):void { var shape:MovieClip=event.currentTarget as MovieClip; var tween:Tween; if (shape.isMove==false) { shape.isMove=true; tween=new Tween(shape,"y",Strong.easeOut,50,150,31,false); for (var i:int=0; i<5; i++) { if (list[i].isMove==true && list[i]!=shape ) { tween=new Tween(list[i],"y",Strong.easeOut,150,50,31,false); list[i].isMove=false; break; } } } else { shape.isMove=false; tween=new Tween(shape,"y",Strong.easeOut,150,50,31,false); } } //属于互排斥问题。

通过一个循环判断当前是否有MC向下移动了，并限制其本身。

for (var i:int=0; i<5; i++)
{
if (list[i].isMove==true && list[i]!=shape )

{

}