GameTutorial

Animation - Helicopter Bettle

In this java tutorial you will learn how to make animations e.g. explosions and how to move background image in a loop e.g. clouds.
For this tutorial I made a game with a goal to destroy as many enemy helicopters as you can with a limited ammo.

In this tutorial I won't describe all classes like I did in tutorials before but I will just describe and tell you how to use this two classes that I wrote for animation. I will also describe how I did rocket smoke.

Animation classes

Classes that are used for animation are Animation.java and MovingBackground.java. And also RocketSmoke.java that is used for smoke behind the helicopter rockets.

Animation.java

To create animation you first need image like this:



This explosion animation image has 12 frames size of 134x134 px. Each frame will be shown 45 milliseconds so that we get correct speed of animation.

Creating explosion animation:

	int frameWidth = 134; 
	int frameHeight = 134;
	int numberOfFrames = 12;
	long frameTime = 45;
	Boolean loopAnim = false;
	long showDelay = 0;
	Animation expAnim = new Animation(explosionAnimImg, 
	frameWidth, frameHeight, numberOfFrames, frameTime, 
	loopAnim, xCoordinate, yCoordinate , showDelay);
	

We can also show animation in loop and also set delay before animation is drawn on the screen.

If you need to move animation across the screen you can change position like this:

	expAnim.x = newXcoordinate;
	expAnim.y = newYcoordinate;
	

or you can call »changeCoordinates« method

	changeCoordinates(newX, newY);
	

Animation object has variable »alive« that tells you if the animation is finished or is still in progress. This can be used for checking if you can ramove explosion from array of explosions.

	ArrayList<Animation> explosionsList = new ArrayList<Animation>();
	for(int i = 0; i < explosionsList.size(); i++){
		// If the animation is over we remove it from the list.
		if(!explosionsList.get(i).active)
			explosionsList.remove(i);
	}
	

The animation is updated every time that is drawn to the screen. So you don't need to explicitly call any method to update it, you just draw it.

	expAnim.Draw(g2d);
	

MovingBackground.java

Like the name tells you this class is intended for background image that moves in loop on x coordinate.
Create object like this:

	MovingBackground cloudLayer1Moving = new MovingBackground();
	cloudLayer1Moving.Initialize(cloudLayer1Img, velocity, yCoordinate);
	

BufferedImage cloudLayer1Img – image that you want to move.
int velocity – speed and direction of the image. If number is negative image will move into left.
int yCoordinate – y coordinate of the image.

This objects is, like animation, updated when you draw it, so all you need to do, is draw it.

	cloudLayer1Moving.Draw(g2d);
	

RocketSmoke.java

Every update cycle, I create two objects of smoke behind every rocket on the screen, each with a litel different position. Every smoke object have its own »life time« and each subsequent object of smoke, of a rocket, has a longer »life time«. Every smoke (image of smoke) slowly becomes bigger and more transparent. That way smoke looks nicer and more natural.

Download game  |  Java web start
Download source code