Saturday, March 19, 2011

Flash animation: rainy & snowy (2)

    This is a demo of snowy.I guess after this one, it will take long time to post the next work since the spring break is over. After spending long time on it, I realize lots of homework need to do.
    Anyway, I do not want just use a black background with snow on it to show the snowy effect, which is boring. The store in the animation is one of the most famous  Convenience Stores in Shanghai called "好德" in Chinese. It is just like "Seven Eleven" in US. I spent 4 years to finish my bachelor degree there.So next time if you go to Shanghai, please pay attention to this store to see whether my work is the same as the real one. To interact with this Flash, please click the "arrow" button on the lower right corner. After it stops, you can click "magnifying glass" to view the inner side of the store (press "ESC" on keyboard to quit zoom), or you can click "福" button to back to the begining of the Flash. I am thinking to develop a game and post here if I have time. I will post the code of snowy later. Enjoy~

//The code of snowy effect is below, I am not the creator,just add some comments, the code is a little complicate, but it is the best snowy effect I have ever seen. In order to make the snow look real, it added many properties to the snow. If you want to use it in your work, just copy the code to the action panel of the first frame. Edit the variables: sceneWidth,sceneHeight and snowNum as you want.

function addMasker()
{
_root.createEmptyMovieClip("masker", -2);// I do not think this line is useful
createSnow();
}
function createSnow()
{
var _l1 = 0;
while (_l1 < snowNum)
{
var _l2 = snowSpace.createEmptyMovieClip("s" + _l1, _l1);// create snow MC
var _l3 = Math.random() * 3; // make different snow different size
drawSnow(_l2, _l3);
_l1++;
}
}
function drawSnow(snow, radius)
{
var p = radius * 0.900000;
with (snow)  //define detail properties of snow
{
colors = [13421772, 16777215];
alphas = [100, 100];
ratios = [0, 255];
matrix = {matrixType: "box", x: -Math.random() * 2 * radius, y: -Math.random() * 2 * radius, w: 2 * radius, h: 2 * radius, r: 1.570796};
beginGradientFill("radial", colors, alphas, ratios, matrix);
curveTo(p, -p, radius, 0);
curveTo(p, p, 0, radius);
curveTo(-p, p, -radius, 0);
curveTo(-p, -p, 0, -radius);
endFill();
}
snowProperty(snow, sceneWidth, sceneHeight);
} // End of the function
function snowProperty(snow, w, h)//give the snow rotation
{
snow._x = sideDisWidth + Math.random() * w;
snow._y = sideDisHeight + Math.random() * h;
snow._rotation = Math.random() * 120 + 30;
snow.stepX = Math.cos(snow._rotation * 3.141593 / 180);
snow.stepY = Math.random() * 2 + 1;
setInterval(snowFall, 35, snow);//set the interval to execute snowFall()
}
function snowFall(snow)// make snow fall
{
snow._x = snow._x + snow.stepX;
snow._y = snow._y + snow.stepY;
if (sideDisWidth > snow._x)
{
snow._x = sideDisWidth + sceneWidth;
} // end if
if (sideDisWidth + sceneWidth < snow._x)
{
snow._x = sideDisWidth;
}
if (sideDisHeight + sceneHeight < snow._y)
{
snow._y = sideDisHeight;
}
}
var sceneWidth = 550;//fill your scene width here
var sceneHeight = 400;//fill your scene height here
var sideDisWidth = Stage.width / 2 - sceneWidth / 2;
var sideDisHeight = Stage.height / 2 - sceneHeight / 2;
var snowNum = 70; // you can change the number of snow
var snowSpace = _root.createEmptyMovieClip("room", 1);
addMasker();


To View Flash Rainy Animation:
Flash animation : rainy & snowy (1)

1 comment:

  1. Hi Sherry. Thanks for visiting my blog. I was happy to visit yours too. I am currently taking a flash class too. Your stuff is pretty nice and inspiring. My stuff is visual development hoping to go into animation or video game concept design.

    - Nelson

    ReplyDelete