This Domain(Admin5.com) is for Sale:

Flash MX设计动物行为效果之蛇篇

时间:2007-11-14  来源:收集  作者:TUPS

  白白的纸上,一只金光闪闪的蛇在不停地游动,效果逼真。而且,我们可以控制蛇的节数的变化。制作中,大家要注重对编程技巧的研究。 wangzhan.dngz.net

  本例效果如下:

AdminI5.com站长之_家

adminI5.com站.长.之.家

 http://www.5dmedia.com/5dmedia/conimages/web/2002-07/mvyp-08-03-lighter.fla

此文来自站长之家

  设计步骤

站长之.家adminI5.com

  打开FlashMX。把场景设置成550px×450px,背景为白色,60fps。

站长之.家adminI5.com

  一、设计元件

站_长之家adminI5.com

  1.制作金蛇

adminI5.com站.长.之.家

  按快捷键Ctrl F8新建一个名为“snake”的影片剪辑。然后在影片剪辑符号“snake”第1帧的场景里制作一个蛇头,如图1,蛇头的长为18px;高为12px。 站.长.之.家

  注重:一定要如图1所示把场景的中心点放在蛇头的中心,防止蛇头和蛇身脱节。

此文來自站长之家


图1蛇头的位置 adminI5.com站长之_家


图2制作蛇节

adminI5.com站.长.之.家

  选中场景中的第2帧,按快捷键F7键新建一个空白要害帧,并如图片2所示制作一个蛇节。蛇节的长为6.5px;高为6.5px。然后分别在第35,70,100帧插入要害帧(按F6),并把相应帧里的蛇节大小改为(6px,4px)、(6px,1.5px)、(6px,1px)。分别选中第2,35,70帧,然后选择Tween下拉列表里的Shape命令。

此文来自站长之家

  2.制作按钮

站长.之家adminI5.com

  按快捷键Ctrl F8新建一个按钮(根据个人爱好随意设计),写上“确定”二字。

adminI5.com站长_之家

  3.设计Action影片(大家可以先跳过这段代码,看下面的步骤)

此文来自站长之家

  按快捷键Ctrl F8新建一个名为“action”的影片剪辑。在“action”的场景里右键单击第1帧,选择Actions命令,在弹出的ActionsFrame面板里输入如下代码:

站_长之家adminI5.com

  tellTarget("_root"){//调用场景中所有的影片

站长.之家adminI5.com

  dx=getProperty("action",_x)-x1;//得到影片“action”在X轴方向上的位移

站长.之家adminI5.com

  dy=getProperty("action",_y)-y1;//得到影片“action”在Y轴方向上的位移

adminI5.com站长_之家

  point=Number(point) 1;//蛇的节数加1

AdminI5.com站长之_家

  if(Number(point)>Number(snake)){

adminI5.com站长之_家

  point=0;

wangzhan.dngz.net

  }

adminI5.com站.长.之.家

  //当蛇的节数增加到默认值时,就把它重置为0,不让这只蛇无限变长

此文来自站长之家

  duplicateMovieClip("head","head"addpoint,point); 站长之_家

  //复制“snake”影片,使蛇的节数不断增加 站长之_家

  x1=getProperty("action",_x);//把影片“action”的x轴坐标赋值给变量x1 站长.之家

  y1=getProperty("action",_y);//把影片“action”的y轴坐标赋值给变量y1

站_长之家adminI5.com

  setProperty("head"addpoint,_x,x1);//把变量x1的值赋值给影片“head”

站_长之家

  setProperty("head"addpoint,_y,y1);//把变量y1的值赋值给影片“head”

站长.之家adminI5.com

  //以上代码实现了蛇的运动

站.长.之.家

  //以下代码实现了蛇节角度的变化,从而使效果逼真

wangzhan.dngz.net

  if(Number(dx)==0){

adminI5.com站.长.之.家

  ror=90;

wangzhan.dngz.net

  //假如影片“action”在的坐标在x轴方向没有变化,则让影片“snake”的角度为90度。其实这也很好理解,因为蛇的头和节都是水平方向设计的,假如影片“snake”的x轴坐标不变,说明蛇在做垂直运动,“ror=90;”就是让蛇的角度也变垂直。 站.长.之.家

  //ror就是控制蛇节角度的变量

此文来自站长之家

  }else{ wangzhan.dngz.net

  x=dy/dx;//这个x就是角度的正切值,大家只要画一个简单的示意图就明白了

此文来自站长之家

  if(Number(x)<0.99andNumber(x)>Number(-0.99)){

站_长之家adminI5.com

  //假如角度值在(-1,1)之间就执行下面的语句 adminI5.com站长之_家

  ror=x*40;

此文来自站長之家

  //本来应该用泰勒展开式计算这个角度值的,但考虑到可能有些朋友不会,所以就简单让它乘以40(也可以不乘),可是这样做蛇就不那么光滑了。还好,颜色可以帮忙,而且这条蛇也不是很大。^o^

共2页: 上一页 1 [2] 下一页

看完这篇,您有何感觉呢?

文章评论

共有0位Admini5网友发表了评论 查看完整内容

24小时热门信息