作者：潇潇 出处：www.j2mefans.com
该文章为本站原创，如有引用，请注明出处和作者
前面我们已经讨论过了从一幅保存有所有游戏中要运用的同一类图像不同状态下的图片分离出一幅幅小的图片的方法，以及将同一类图像的所有小图片存放在一个图像数组中，组成一个动画帧的方法。下面我们就使用这两种方法来做一个演示。
我们还是先看一下图片吧！
可以看到图像中有两种颜色的数字。我们就使用前面的方法，从中分离出数字动画。
对于这幅图片，我们要知道的是其中每一个小图像的大小。整幅图的大小为100*30（长*宽），其中每一个小的数字的大小是10*15（长*宽）。
下面是源代码,其中添加了注释：
import javax.microedition.midlet.*;
import javax.microedition.lcdui.*;
import java.io.IOException;
/**
* MIDlet派生类
*/
public class SpriteTest extends MIDlet implements CommandListener, Runnable
{
private static int NUM_FRAME_WIDTH = 10;
private static int NUM_FRAME_HEIGHT = 15;
private MyCanvas myCanvas; //屏幕绘制类
private Command quit;
private Image[] numFrames; //存储图像数组
private boolean running;
private int currentFrame; //纪录图像当前播放的帧
/**
* 自定义的画布类，涌来绘制图像.
*/
class MyCanvas extends Canvas
{
/**
* 绘制屏幕当前帧.
*/
protected void paint(Graphics graphics)
{
//清屏
graphics.setColor(0);
graphics.fillRect(0, 0, getWidth(), getHeight());
//绘制图像当前帧
graphics.drawImage(numFrames[currentFrame], getWidth() / 2,
getHeight() / 2,
Graphics.HCENTER | Graphics.VCENTER);
}
}
/**
* 从number.png大图中提取每一个数字，并按照顺序一一播放到屏幕上.
*/
public SpriteTest()
{
try
{
// 载入大图并提取每一个数字
Image numImage = Image.createImage("/number.png");
numFrames = extractFrames(numImage, 0,
0, 10, 2, NUM_FRAME_WIDTH,
NUM_FRAME_HEIGHT);
}
catch (IOException ioe)
{
System.out.println("unable to load image");
}
// Construct a the canvas
myCanvas = new MyCanvas();
// And a way to quit
quit = new Command("Quit", Command.EXIT, 2);
myCanvas.addCommand(quit);
myCanvas.setCommandListener(this);
// create the thread that will carry out the animation.
running = true;
Thread t = new Thread(this);
t.start();
}
/**这是我们主要使用的函数关于他的解释清参看下面地址
* http://www.j2mefans.com/blog/trackback.asp?tbID=87
*
* Extracts a portion of an image using clipping.
* @param source The source image.
* @param x The starting x position of the clipping rectangle.
* @param y The starting y position of the clipping rectangle.
* @param width The width of the clipping rectangle.
* @param height The height of the clipping rectangle.
* @return A new Image object containing only the portion of the image
* withing the x, y, width, height rectangle.
*/
public final static Image getImageRegion(Image source, int x, int y, int width, int height)
{
// create a placeholder for our resulting image region
Image result = Image.createImage(width, height);
if (x + width > source.getWidth() || y + height > source.getHeight())
System.out.println("Warning: attempting extract using (" +
x + "," + y + "," + width + "," + height + ") when image is " +
"(" + source.getWidth() + "," + source.getHeight() + ")");
// draw the image, offset by the region starting position
result.getGraphics().drawImage(source, -x, -y, Graphics.TOP | Graphics.LEFT);
return result;
}
/**这是我们主要使用的函数关于他的解释清参看下面地址
* http://www.j2mefans.com/blog/trackback.asp?tbID=87
*
* Gets an array of images by breaking a larger image into smaller frames.
* @param sourceImage The image to extract the frames from.
* @param sourceX The starting x position in the source image to use.
* @param sourceY The starting y position in the source image to use.
* @param framesWide The number of frames across the source image to extract.
* @param framesHigh The number of frames down the source image to extract.
* @param frameWidth The width of each of those frames.
* @param frameHeight The height of each of those frames.
* @return An array containing an image for each frame.
*/
public final static Image[] extractFrames(Image sourceImage, int sourceX,
int sourceY,
int framesWide, int framesHigh,
int frameWidth, int frameHeight)
{
// extract all the frames from the source image
Image[] frames = new Image[framesWide*framesHigh];
int frameCount = 0;
for (int fy = 0; fy < framesHigh; fy++)
for (int fx = 0; fx < framesWide; fx++)
frames[frameCount++] =
getImageRegion(sourceImage, sourceX + (fx * frameWidth),
sourceY + (fy * frameHeight),
frameWidth, frameHeight);
return frames;
}
public void run()
{
while (running)
{
// 更新图像的当前帧
currentFrame++;
if (currentFrame > 19)
currentFrame = 0;
// 请求画布重新绘制.
myCanvas.repaint();
try
{
// Hang around a bit.
Thread.sleep(100);
}
catch (InterruptedException e)
{
}
}
}
/**
* Handles Application Manager notification the MIDlet is starting (or
* resuning from a pause). In this case we set the canvas as the current
* display screen.
* @throws MIDletStateChangeException
*/
protected void startApp() throws MIDletStateChangeException
{
Display.getDisplay(this).setCurrent(myCanvas);
}
/**
* Handles Application Manager notification the MIDlet is about to be paused.
* We don’t bother doing anything for this case.
*/
protected void pauseApp()
{
}
/**
* Handles Application Manager notification the MIDlet is about to be
* destroyed. We don’t bother doing anything for this case.
*/
protected void destroyApp(boolean unconditional)
throws MIDletStateChangeException
{
}
/**
* The CommandListener interface method called when the user executes
* a Command, in this case it can only be the quit command we created in the
* consutructor and added to the Canvas.
* @param command The command that was executed.
* @param displayable The displayable that command was embedded within.
*/
public void commandAction(Command command, Displayable displayable)
{
try
{
if (command == quit)
{
running = false;
destroyApp(true);
notifyDestroyed();
}
}
catch (MIDletStateChangeException me)
{
System.out.println(me + " caught.");
}
}
}