Login | Register   
RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Go Fishing with the New MIDP 2.0 Game APIs : Page 2

Game developers have been using MIDP since its inception, but it was only with the release of MIDP 2.0 that this platform included tools specifically made for game development. Learn how these five new classes can help you create richer, more smoothly-animated graphics.




Full Text Search: The Key to Better Natural Language Queries for NoSQL in Node.js

Ode to the Etch-a-sketch
Using the GameCanvas tools discussed thus far, it's possible to create a simple sketch game can be created. Listing 1 shows the game loop that monitors key states and draws lines in the direction of the current key state.

Figure 1 shows an example of what the sketch game looks like when played.

Figure 1. The Sketch Game: Select The image shows an example of running the Sketch game.
Figure 2. Sprite Fish: This is the Fish imageused to create a Sprite.

Use of Layering
The game APIs are built with the concept of graphics layering in mind. This helps them support more complex interactions of visual elements on a single display. MIDP 2.0's Layer is an abstract class that defines a layer as being a visual element with a position and size that is movable. Layers can also be shown and hidden. There are two types of Layers implemented by the APIs, Sprite and TiledLayer. There is also a LayerManager class that provides a way to manage relationships between layers.

Using Sprites to Animate Images
This next section builds on the sketch game but replaces the line drawing with a graphic of a fish. The arrow keys are used to move the fish around the screen.

The Sprite class provides tools for manipulating images and rendering animated graphics. You can create a Sprite with an image containing one or more frames. Only one frame of a Sprite is visible at a given time. However, a game may sequence through the frames by calling nextFrame() or previousFrame(), causing the Sprite image to change and to animate the image.

Sprite offers other tools for animation as well, such as flipping and rotating about a specified reference point. Define this reference point by calling Sprite.defineReferencePixel() and providing an x, y pixel location. Then simply rotate the Sprite about this point by making calls to Sprite.setTransform() and passing one of the following values:



Reflects the Sprite about its vertical center



Reflects the Sprite about its vertical center and rotates it by 180 degrees.



Reflects the Sprite about its vertical center and rotates it by 270 degrees.



Reflects the Sprite about its vertical center and rotates it by 90 degrees.



Applies no transform to the Sprite. The Sprite returns to its original position.



Rotates the Sprite by 180 degrees.



Rotates the Sprite by 270 degrees.



Rotates the Sprite by 90 degrees.

Something Fishy
Sprite handles images of arbitrary shape. However, a height and width need to be specified, in pixels, when the image is loaded into the Sprite.

For this example, I created a 32 x 32 pixel image of a fish using Microsoft Paint and saving it as a PNG file. The image is shown in Figure 2.

Figure 3. Running the Fish Loop: Fish moving and responding to the user pressing the up, down, right, and left keys.

You can make the fish image accessible to a MIDlet by placing the PNG file within the res directory of Wireless Toolkit app structure.

Next, use the image to create a Sprite:

Image image = Image.createImage("/fish.png"); Sprite sprite = new Sprite(image, 32, 32);

Defining a reference pixel within the Sprite (actually, you can even define the pixel outside the bounds of the Sprite) allows you to manipulate the Sprite about the specified point. The following code defines areference pixel, relative to the dimensions of the Sprite, and then sets the Sprite's reference pixel to position 20, 20 within the screen.

fish.defineReferencePixel(3,3); fish.setPosition(20,20);

Calling the Sprite supports a method called paint(), which is called when a game wishes to render the Sprite to the screen after changing various states. If GameCanvas is used, a call to flushGraphics() is also required to actually render the image from the off-screen buffer onto the screen.

Listing 2 modifies the Sketch game created earlier. Instead of continually drawing lines, the screen is repainted during the game cycle to show the fish Sprite moving in response to the user pressing the left, right, up, and down keys.

The effect of running the fish loop is shown in Figure 3.

Comment and Contribute






(Maximum characters: 1200). You have 1200 characters left.



Thanks for your registration, follow us on our social networks to keep up-to-date