logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
Houseplants
Romance Movies
Creativity
Family Travel
Southwest USA
Irish Culture
Home Finance


dailyclick
All times in EST

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

The ENTER_FRAME Event Listener to Animate Particles


In this FlashR CS3 tutorial, we will continue to work on and improve our particle system snow scene. We will concentrate on one snowflake and program that flake to fall down the stage. We will do this by progressively increasing the value of the Y position for this snowflake movie clip and we will do this with a new event listener called the ENTER_FRAME event listener.

You might be asking why increasing the value of the Y position will cause the flake to fall instead of rise. Remember, that at the upper left corner of the stage, the X and Y positions are both zero. As we move horizontally along the X axis, the numbers increase and as we move down the Y axis the number also increase. So for our snow scene, the stage is 400 pixels high and the bottom most Y position is 400.

Our first step is to change the code that generates several instances of the mcSnowflake movie clip from the Library onto the stage. If you remember, we used a for loop to do this.

var _Snowflake:mcSnowflake;

for (var i:Number = 0; i < 10; i++)
{
_Snowflake = new mcSnowflake();
addChild(_Snowflake);
_Snowflake.x = Math.random() * 510;
_Snowflake.y = Math.random() * 40;
}

But we only need one instance on the stage for this tutorial. So, let's remove the for loop from the above code. We do not need to change the Math.random() code at this time. Below is the code that is left.

var _Snowflake:mcSnowflake;

_Snowflake = new mcSnowflake();
addChild(_Snowflake);
_Snowflake.x = Math.random() * 510;
_Snowflake.y = Math.random() * 40;

Test your movie several times and you will get only one snowflake each time at a random position.

Now we can add the code that will create the snowfall animation for the movie clip. We will do this with a function that we will call "snowfall". The function will continuously increase the Y position by 10 pixels.

function snowfall():void
{
_Snowflake.y += 10;
}

Easy enough, but we still need to call the function to make it work. We will do this with a new event listener called the ENTER_FRAME event listener. This event listener will "listen" for each time our movie enters a new frame and call the snowfall function, the event handler, each time. Therefore, because our Frame Rate is set to the default 12 frames per second in the Document Properties, the snowfall function will be triggered 12 times per second.

So, we need to attach this event listener to something. Because we won't be listening for a mouse event as in our previous tutorial about event listeners, we can add or attach the event listener to the stage.

stage.addEventListener();

We need to identify the event that we want to listen for as an ENTER_FRAME event.

stage.addEventListener(Event.ENTER_FRAME);

And we need to identify the snowfall function as our event handler.

stage.addEventListener(Event.ENTER_FRAME, snowfall);

Finally, we need to coordinate the snowfall function with the event.

function snowfall(event:Event):void
{
_Snowflake.y += 10;
}

Test your movie and you will finally see our snowflake fall down the stage.

Here is the code that we have written.

stage.addEventListener(Event.ENTER_FRAME, snowfall);

var _Snowflake:mcSnowflake;

_Snowflake = new mcSnowflake();
addChild(_Snowflake);
_Snowflake.x = Math.random() * 510;
_Snowflake.y = Math.random() * 40;

function snowfall(event:Event):void
{
_Snowflake.y += 10;
}

Save your snow scene as SnowScene4.fla.





Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Twitter Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Facebook Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to MySpace Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Del.icio.us Digg The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Yahoo My Web Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Google Bookmarks Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Stumbleupon Add The+ENTER%5FFRAME+Event+Listener+to+Animate+Particles to Reddit



 



RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map


For FREE email updates, subscribe to the Flash and Animation Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

g


g features
Drop Zones and Transitions in Motion 5

Craft Product Template - Background Layer

Craft Product Template Layers

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor