您现在的位置:中国下载站学院中心网页设计Flash教程Action应用 → 文章列表

Flash AS 实现好看的清晰的飘动云和风吹草动画

作者:佚名  来源:不详  发布时间:2007-11-15 16:02:36   

减小字体 增大字体

 
 

Flash 的AS是非常神奇的,今天通过本例大家就体会出来了!可以直接用代码生成云飘动,草被风吹的左右摇摆的动画。至于动画效果,因为AS总是运算,所以你的机器是会越来越慢的!我这里就不提供在线效果了!给大家截个图。提供源文件给大家下载。

Flash AS 实现好看的清晰的飘动云和风吹草动画

点击这里下载Fla源文件(压缩包里包括Fla和SWF)

简单描述下制作方法。

首先建立两个空的影片剪辑cloud和grass。

先建立云的影片剪辑(里面什么都不画)

Flash AS 实现好看的清晰的飘动云和风吹草动画

选择该元件的第一帧,添加如下代码。

//Number of clouds
clouds=6;
//These are just general boundaries.
//To use exact boundaries, create a mask in the parent level of the size desired
//Height of the sky
skyheight=Stage.height;
//Width of the sky
skywidth=Stage.width;
//Max size of a cloud
cloudsize=300;
//Amount of blur applied to the shapes to make them cloud-like
blursize=40;
//Clouds move at a random speed. this is the minimum speed
cloudminspeed=.5;
//Variance in speed from cloud to cloud
cloudspeedvariance=1;
//Create the clouds
for(c=1;c<=clouds;c++){
//create an empty movie clip to hold the cloud
 this.createEmptyMovieClip("cloud"+c,this.getNextHighestDepth());
//generate a cloud. Pass in the instance name of the newly created cloud
 shapecloud("cloud"+c);
//Set the x position to a random position within the boundaries
 eval("cloud"+c)._x=Math.random()*skywidth-eval("cloud"+c)._x/2;
//Set the y position to a random position within the boundaries
 eval("cloud"+c)._y=Math.random()*(skyheight)-eval("cloud"+c)._height;
}
//Run at the start of each frame
onEnterFrame=function(){
//Run for each cloud
 for(c=1;c<=clouds;c++){
//Move the cloud to the left according to its speed
  eval("cloud"+c)._x-=eval("cloud"+c).cloudspeed;
//If the cloud is past the stage to the left, reset it to the right. Create a new shape and color  
  if(eval("cloud"+c)._x+(eval("cloud"+c)._width/2)+cloudsize<0){
//Reset the x position
   eval("cloud"+c)._x=skywidth;
//Reshape and recolor the cloud
   shapecloud("cloud"+c);
  }
 }
}
//This function creates the shape and color of a cloud
function shapecloud(cloudid){
//Clear the current contents of the cloud
 eval(cloudid).clear();
//Set the new shade between 224 and 255. This number is used for the red, green, and blue, to create a grayscale color
 cloudcolor=Math.round(Math.random()*31)+224;
//Use no line
 eval(cloudid).lineStyle(undefined, (cloudcolor+cloudcolor*0x100+cloudcolor*0x10000), 100, false, "none", "none", "none", 1);
//Set the fill color. cloudcolor is used 3 times, for red, green, and blue
 eval(cloudid).beginFill((cloudcolor+cloudcolor*0x100+cloudcolor*0x10000));
//Set a starting coordinate for the cloud 
 eval(cloudid).moveTo(Math.random()*cloudsize,Math.random()*cloudsize);
//Draw an invisible line to another point the combined lines form shapes, which are the clouds.
//They don't look much like clouds until the blur is applied
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
//Apply a blur to the shape
 eval(cloudid).filters = [new flash.filters.BlurFilter(blursize,blursize,2)];
//Set a new cloud speed
 eval(cloudid).cloudspeed=Math.random()*cloudspeedvariance+cloudminspeed; 
}

同样办法再新建立一个草的影片剪辑

Flash AS 实现好看的清晰的飘动云和风吹草动画

选择第一帧添加如下代码。

//Height of each blade of grass
grassheight=35;
//Average space in between each blade of grass
grassspacing=5;
//Maximum sway of each blade of grass
maxsway=20;
//Number of blades of grass along the x axis
xplots=30;
//Number of blades of grass along the y axis
yplots=20;
//The wind has an x position and the grass is attracted to the position
windxpos=0;
//Velocity of the wind left and right
windspeed=0;
//Gives the grass a bent effect. The grass bends 1/4 of the way up
grasscontrol=grassheight/4;
//Array containing the info for each blade of grass
grasscoords=[];
//These loops go through the field, planting each blade of grass
for (xpos=0; xpos<xplots; xpos++) {
 for (ypos=0; ypos<yplots; ypos++) {
  //x position, y position, sway, and color
  grasscoords.push([xpos*grassspacing+Math.random()*grassspacing,ypos*grassspacing+Math.random()*grassspacing,0,Math.round(Math.random()*128)*65536+Math.round(Math.random()*76+146)*256]);
 }
}
//Run on each frame
onEnterFrame=function(){
//Clear all of the grass so it can be redrawn with different sway
 this.clear();
//Change the speed of the wind
 windspeed=Math.max(-50,Math.min(50,windspeed+Math.random()*40-20));
//Move the position the blades are attracted according to the windxpos
 windxpos+=windspeed;
//If the windxpos moves too far to the left, reverse its speed
 if(windxpos<-100){
  windxpos=-100;
  windspeed*=-1;
 }
//If the windxpos moves too far to the right, reverse its speed
 else if(windxpos>grassspacing*xplots+100){
  windxpos=grassspacing*xplots+100;
  windspeed*=-1;
 }
//handle the redraw for each blade of grass
 for(coord=0;coord<grasscoords.length;coord++){
//Set the line style. 0 means use hairline width and grasscoords[coord][3] is the color   
  this.lineStyle(0, grasscoords[coord][3], 100,

[1] [2]  下一页


在百度中搜索更多Flash AS 实现好看的清晰的飘动云和风吹草动画相关网页 转贴于:中国下载站

  • 上一篇文章:Flash实现动画影片中图片缓冲放大和缩小效果
  • 下一篇文章:Flash AS以贪吃蛇小游戏为实例学习类编程
  • 阅读统计:[]
  • 中国下载站】【设为主页】【收藏本页】【打印本文】【回到顶部】【关闭此页

    相关文章
    文章评论(评论内容只代表网友观点,与本站立场无关!)

    用户名: 查看更多评论

    分 值:100分 85分 70分 55分 40分 25分 10分 0分

    内 容:

             (注“”为必填内容。) 验证码: 验证码,看不清楚?请点击刷新验证码


    设为首页 - 关于我们 - 广告服务 - 网站地图 - 加入收藏 - 网站声明 - 网站帮助 - 友情链接

    • Copyright (C) 2006-2008 www.cndownz.com All Rights Reserved.
      中国下载站 版权所有. 粤ICP备05141802号. 对本站有任何建议、意见或投诉,请来信:cndownzcom@yahoo.com.cn.
      喜欢中国下载站(cndownz.com),请把中国下载站(cndownz.com)告诉你QQ上的5位好友,多谢支持!