Flash 8 Bouncing Ball Animation

This flash 8 bouncing ball animation tutorial is a text version of the flash 8 video tutorial for bouncing ball. First of all create a movieclip(F8 - type is MovieClip, name is ball) called ball, giving it the instance name of ball_mc(Properties - instance name). Then work out how far you want the ball to drop. In this example the ball will drop to a _y property value of 280. So keep that in mind or write it down. Rename the layer that the ball is on to ball, create another layer and call it actions. Lock both these layers.

Click on frame 1 of the actions layer and hit key F9 to open the actions window. We are going to import the Tween class and Easing class, so write this down in the actions window:-

	import mx.transitions.Tween;
	import mx.transitions.easing.*;

Then you will need to create a new instance of the Tween class so that it does all the moving about. The Tween class constructor takes a number of parameters. They are like so"
Tween(movieclip to move, What property to move, the easing on the tween, where we start the tween, where we end the tween, how long to do the Tween for, Boolean value for UseSeconds?);

	new Tween(ball_mc,"_y",Bounce.easeOut,ball_mc._y, 280,3,true);

Now test the movie out to make sure it is working. (Control + Enter). It should bounce up and down a little bit and then stop.

If we want the ball to bounce and then go across the page, then create a new Tween that will move the _x value of the movieclip across the page. So add this code that will move the x property of the ball across the page with no easing to the _x value of 400 and with the same time as the y value tween.

 

	new Tween(ball_mc,"_x",None.easeNone,ball_mc._x, 400,3,true);

So test that out and it should bounce as well as move across the page. Change the x value to whatever you want. If you want it go off offscreen, change the ending x value to more than the width of your stage. So here is the complete code for this tutorial. Enjoy.

	import mx.transitions.Tween;
	import mx.transitions.easing.*;
	
	new Tween(ball_mc,"_y",Bounce.easeOut,ball_mc._y, 280,3,true);
	new Tween(ball_mc,"_x",None.easeNone,ball_mc._x, 400,3,true);
	

Flash 8 Resources

Hollywood 2D Digital Animation: The New Flash Production Revolution - Digital animation using Flash, is primed to take Hollywood and TeleVision by storm with two feature films and three television shows underway. This book describes why Flash is the future of broadcast animation. As the future of 2D animation, the knowledge provided to the reader by this book will be a necessity for animators.