屏幕快照
在这一章你将创建你的第一个 MIDlet 程序来学习如何用精灵来创建简单的动画。 ( 图 8) 展示了模拟器上运行的完整的 MIDlet 程序的一系列屏幕快照。
(图8)

螺旋运动的精灵
我们的 MIDlet 程序的精灵如 ( 图 9) 所示：
(图9)
这个精灵由4行4列，16张独立的帧组成。每一帧按次序显示以创建动画效果。

创建精灵类：AnimationSprite.java

在本教程中，对于你要开发的每一个MIDlet程序，当使用Wieless Toolkit(WTK)开发时，都遵循一组相同的开发步骤：

1. 创建工程.

2. 书写源代码.

3. 编译和预校验源代码.

4. 运行MIDlet.

创建工程

创建一个新的工程

1. 点击New Project.

2. 输入工程名和MIDlet类名，如(图10)所示.

3. 点击Create Project.
(图10)

编写代码：第一步

在这个MIDlet程序中你将发现3个源代码文件：

° AnimationSprite.java: 精灵类

° AnimationCanvas.java: 显示精灵的GameCanvas

° Animation.java: MIDlet程序启动和停止的代码

将下面的AnimationSprite.java代码拷贝粘贴到文本编辑器：

/**//*---------------------------------------------
* AnimationSprite.java
*----------------------------------------------*/
import javax.microedition.lcdui.game.*;
import javax.microedition.lcdui.*;
public class AnimationSprite extends Sprite{
  public AnimationSprite(Image image, int frameWidth, int frameHeight){
    // 调用Sprite的构造函数
    super(image, frameWidth, frameHeight);
  }
}

所示：
(图11)
注意：启动器盘符和WTK目录会根据Toolkit安装目录的不同而不同。

编写代码：第二步
把下面的AnimationCanvas.java的代码拷贝到文本编辑器中，把文件保存到上一节中的相同的目录下。

/**//*--------------------------------------------------
* AnimationCanvas.java
*-------------------------------------------------*/
import javax.microedition.lcdui.game.*;
import javax.microedition.lcdui.*;
public class AnimationCanvas extends GameCanvas implements Runnable{
    // 一帧精灵图像的尺寸
    private static final int FRAME_WIDTH = 57;
    private static final int FRAME_HEIGHT = 53;
    private AnimationSprite spSpiral; // 动画精灵
    private LayerManager lmgr; // 图层管理器
    private boolean running = false; // 线程是否启动
    public AnimationCanvas(){
        // 游戏画布构造函数
        super(true);
        try{
            // 创建动画精灵
            spSpiral = new AnimationSprite(Image.createImage("/spiral.png");
            // 将精灵的参考象素移到精灵的中间
            spSpiral.defineReferencePixel(FRAME_WIDTH / 2, FRAME_HEIGHT / 2);
            // 将精灵放置在屏幕中心
            // (精灵的中心和屏幕的中心重合)
            spSpiral.setRefPixelPosition(getWidth() / 2, getHeight() / 2);
            // 创建图层管理器
            lmgr = new LayerManager();
            lmgr.append(spSpiral);
        }catch (Exception e){
            System.out.println("Unable to read PNG image");
        }
    }
    /**//*--------------------------------------------------
    * 启动线程
    *-------------------------------------------------*/
    public void start(){
        running = true;
        Thread t = new Thread(this);
        t.start();
    }
    /**//*--------------------------------------------------
    * 主循环
    *-------------------------------------------------*/
    public void run(){
        Graphics g = getGraphics();
        while (running){
            // 刷新屏幕
            drawDisplay(g);
            try{
                Thread.sleep(150);
            } catch (InterruptedException ie) {
                System.out.println("Thread exception");
            }
        }
    }
    /**//*--------------------------------------------------
    * 刷新屏幕
    *-------------------------------------------------*/
    private void drawDisplay(Graphics g){
        // 显示下一帧精灵图像
        spSpiral.nextFrame();
        // 绘制图层
        lmgr.paint(g, 0, 0);
        // 将屏幕缓冲刷新到屏幕
        flushGraphics();
    }
    /**//*--------------------------------------------------
    * 停止线程
    *-------------------------------------------------*/
    public void stop(){
        running = false;
    }
}

编写代码：第三步
最后一部分代码如下所示。复制到文本编辑器中并另存为Animation.java:

/**//*--------------------------------------------------
* Animation.java
**
显示动画精灵
*-------------------------------------------------*/
import javax.microedition.midlet.*;
import javax.microedition.lcdui.*;
public class Animation extends MIDlet implements CommandListener{
    private Display display; 
    private AnimationCanvas canvas; // 游戏画布
    private Command cmExit; // 退出按钮

    public Animation(){
        display = Display.getDisplay(this);
        cmExit = new Command("Exit", Command.EXIT, 1);
        // 创建游戏画布和退出按钮
        if ((canvas = new AnimationCanvas()) != null){
            canvas.addCommand(cmExit);
            canvas.setCommandListener(this);
        }
    }

    public void startApp(){
        if (canvas != null){
        display.setCurrent(canvas);
        canvas.start();
        }
    }

    public void pauseApp(){
    }

    public void destroyApp(boolean unconditional){
        canvas.stop();
    }

    public void commandAction(Command c, Displayable s){
        if (c == cmExit){
            destroyApp(true);
            notifyDestroyed();
        }
    }
}

编译和预校验
单击 Build 按钮完成编译、预校验和打包。入图 12 所示。然后点击 Run 启动应用管理器。
(图12)

启动MIDlet
(图13)
单击Launch启动Aninate MIDlet，如图13所示。启动以后你将会看到如图14所示的一系列屏幕输出画面。
(图14)

代码回顾：创建精灵
让我们回去一下创建动画精灵的代码。这一节以及后面 3 节的代码片段均来自 AnimationCanvas.java. 文件

//  一帧精灵图像的尺寸
private   static   final   int  FRAME_WIDTH  =   57 ;
private   static   final   int  FRAME_HEIGHT  =   53 ;

//  创建动画精灵
spSpiral  =   new  AnimationSprite(Image.createImage( " /spiral.png " );

精灵通过一个已经存在的 PNG 文件创建。 FRAME_WIDTH 和 FRAME_HEIGTH 表示图像中每一帧的宽度和高度。图 15 是同于创建精灵的实际图片，而图 16 把图像拆分成一个个独立的帧。
(图15)(图16)

代码回顾：设置参考像素
下面代码的第一行将精灵的参考像素移到了精灵的中间，紧接着调用setRefPixelPosition()将新的参考像素放置到设备屏幕的中心，最后的结果就是精灵的参考像素和设备屏幕的中心重合。

//  将精灵的参考象素移到精灵的中间
spSpiral.defineReferencePixel(FRAME_WIDTH  /   2 , FRAME_HEIGHT  /   2 );
//  将精灵放置在屏幕中心
//  (精灵的中心和屏幕的中心重合)
spSpiral.setRefPixelPosition(getWidth()  /   2 , getHeight()  /   2 );
//  创建图层管理器
lmgr  =   new  LayerManager();
lmgr.append(spSpiral);

所需的全部知识。

代码回顾：运行动画
万事具备，下一步要做的就是开启一个线程，轮流画出精灵的图像帧。

    /**//*--------------------------------------------------
    * 启动线程
    *-------------------------------------------------*/
    public void start(){
        running = true;
        Thread t = new Thread(this);
        t.start();
    }
    /**//*--------------------------------------------------
    * 主循环
    *-------------------------------------------------*/
    public void run(){
        Graphics g = getGraphics();
        while (running){
            // 刷新屏幕
            drawDisplay(g);
            try{
                Thread.sleep(150);
            } catch (InterruptedException ie) {
                System.out.println("Thread exception");
            }
        }
    }

线程运行时，RUN()控制着多长时间更新一次屏幕。每一次循环运行到drawDisplay()就画出下一帧图像。下一节你将会看到drawDisplay()的内部细节。

代码回顾：画出图像帧
前面我们用FRAME_WIDTH和FRAME_HEIGHT定义了帧的宽度和高度。利用这些信息MIDlet能够计算出图像中有多少帧图像。知道了有多少帧图像，nextFrame()就能恰当的循环遍历每一帧图像，并且当达到最后一帧时跳回到第一帧重新开始。

/**//*--------------------------------------------------
    * 刷新屏幕
    *-------------------------------------------------*/
    private void drawDisplay(Graphics g){
        // 显示下一帧精灵图像
        spSpiral.nextFrame();
        // 绘制图层
        lmgr.paint(g, 0, 0);
        // 将屏幕缓冲刷新到屏幕
        flushGraphics();
    }

图层管理器在指定位置绘制每一个图层，图层的位置取决于图层相对于屏幕的位置。在这个 MIDlet 中，你要求图层绘制在（0,0 ）处。

如果你利用屏幕的顶部显示其他信息，例如显示分数，你可以改变传递给 Paint ()函数的 x,y 坐标值来适应这个要求。例如图 17 中，坐标设置在了（ 17, 17 ）处以便统计附加信息显示到屏幕顶部。这张图片直接从 Sun Microsystems 的 MDIP2.0  API文档里截取而来。

                  to be continue...