Building a J2ME Game: Sprites and LayerManager
So far, I have used an image of a jumping couple to showcase a game element.
A D V E R T I S E M E N T
This element is currently rendered as an image; but it makes sense to render it
as a sprite instead. A sprite is a term in gaming parlance that refers to any
visual element, usually an animated image, that can be moved around the screen
independently of the other elements. The Sprite class is used to
represent sprites in the MIDP 2.0 gaming API. This class provides methods to
animate the sprite based on a handful of images, similar to the way backgrounds
are created using the TiledLayer class. More importantly, it
provides methods to check collisions with other game elements, including images,
sprites, or tiled layers.
Let's start by converting the existing couple image into a sprite. To
showcase animation, I will use the image showed in Figure 7, which is the couple
image duplicated over with a different color into two different frames, each 10
by 10 pixels each.
Figure 7. Frames for couple Sprite animation
Similar to the TiledLayer class, the Sprite class
requires that the size of each frame be passed in to its constructor. This is
shown here:
coupleSprite = new Sprite(coupleImg, 10, 10);
This code, added after the creation of the couple image in the start()
method, creates a couple sprite with two frames of 10 by 10 pixels each,
numbered from 0 onwards. Thus, to alternate between the sprite images, you can
call the nextFrame() method, which gets the next image in the
current sequence. Since there are only two images in this sprite sequence, they
will be shown one after another. If you want to make a particular frame/image
the current displayable image for a sprite in a longer frame sequence, you can
do so by using the method setFrame(int sequenceNo). In this case,
add coupleSprite.nextFrame() in the updateGameScreen()
method.
You now don't want the couple image to be painted on the screen. Before the
couple sprite can be painted on the screen, you need to define a reference pixel
for it. Think of this as an origin around which all painting operations are
done. By default, a sprite is painted with its upper left corner as its origin.
Similar to the way you set the reference of the couple image using the
Graphics.HCENTER | Graphics.BOTTOM code, you need to define a reference
pixel for the sprite. This is shown here:
coupleSprite.defineReferencePixel(coupleSprite.getWidth()/2, coupleSprite.getHeight());
Add this snippet after the creation of the sprite as described earlier. Now,
instead of positioning the sprite based on its original origin, you will
position it based on this reference pixel as, shown here:
coupleSprite.setRefPixelPosition(coupleX, coupleY);
coupleSprite.paint(g);
The last line in this code snippet paints the sprite on the graphics object
that is passed to it. As expected, you will need to insert these lines in the
updateGameScreen() method in lieu of the lines that painted the
couple image. The final result will look exactly the same as before, except the
jumping couple will be replaced with a flickering jumping couple!
Before going forward, make sure that you change all references to the
coupleImg variable to coupleSprite in thecalculateX()
and calculateY() methods.
|