Create a MIDlet that uses custom animation

by Retired ‎02-12-2010 04:39 PM - edited ‎09-16-2010 02:54 PM (2,432 Views)

Summary

 

This article applies to the following:

  • BlackBerry® wireless devices based on Java™
  • Java 2 Platform, Micro Edition (J2ME™)

Procedure

 

You can create an animation using timers and MIDlet graphics. These techniques can be applied to the animation of any graphic objects that are in the form of a MIDlet or BlackBerry application.

 

To run the following code in the BlackBerry Java Development Environment (JDE), complete the following steps:

  1. Open the BlackBerry JDE.
  2. Create a new workspace and name it (for example, Animation.jdw).
  3. Create a new project and name it (for example, Sunset.jdp).
  4. Create a new file and name it (for example, Sunset.java).
  5. Copy the source code, as shown below, into the Sunset.java file.
  6. In the workspace, right-click the project and click Properties.
  7. In the project properties window, on the General tab, type the title of the MIDlet (this title appears on the Home screen as the name of the application). Optionally, you can complete the Version, Vendor, and Description fields.
  8. In the project properties window, on the Application tab, specify MIDlet as the project type and type Sunset as the name of the main MIDlet class.
  9. Click OK.
  10. In the BlackBerry JDE, press F5 to run and debug the Sunset MIDlet in the BlackBerry simulator.

 

--------------------------------------------------------------
import java.util.Timer;
import java.util.TimerTask;
import javax.microedition.lcdui.*;
import javax.microedition.midlet.MIDlet;

public class Sunset extends MIDlet implements CommandListener{
     private Display display;
     //flag to set after startApp() is called
     protected boolean started;
     //Exit menu command
     private Command exitCommand;
     //view static graphics menu command
     private Command viewCommand;
     //watch the Sunset menu command
     private Command animateCommand;
     //Erase canvas menu command
     private Command eraseCommand;
     //animation canvas object
     private AnimationCanvas animationCanvas;
     //static graphics canvas object
     private StaticCanvas staticCanvas;
     //blank canvas object
     private BlankCanvas blankCanvas;
     //static frame rate value
     private static final int frameRate = 5;
     //entry point for the MIDlet
     protected void startApp() {
          if(!started) {
               display = Display.getDisplay(this);
               //static graphics canvas
               staticCanvas = createStaticCanvas();
               //menu commands to be added to each canvas
               exitCommand = new Command("Exit",Command.EXIT, 0);
               viewCommand = new Command("View", Command.SCREEN, 0);
               eraseCommand = new Command("Clear", Command.SCREEN, 0);
               animateCommand = new Command("Watch the Sunset", Command.SCREEN, 0);
               //add the commands to the static graphics canvas screen
               staticCanvas.addCommand(exitCommand);
               staticCanvas.addCommand(eraseCommand);
               staticCanvas.addCommand(animateCommand);
               //add command listener to the static graphics canvas
               staticCanvas.setCommandListener(this);
               //set the current display to the static graphics canvas
               display.setCurrent(staticCanvas);
               //set flag to indicate the application has started
               started = true;
          }
     }
     //overwritten pauseApp function with no specified functionality
     protected void pauseApp() {
     }
     //overwritten destroyApp function with no specified functionality
     protected void destroyApp(boolean bool) {
     }
     //used to determine what to do when a certain command is called (from the menu)
     public void commandAction(Command c, Displayable d) {
          //destroy the app if exit command selected
          if(c == exitCommand) {
               notifyDestroyed();
          }
          //view the static graphics canvas if view command is selected
          else if (c == viewCommand) {
               display = Display.getDisplay(this);
               staticCanvas.addCommand(exitCommand);
               staticCanvas.addCommand(eraseCommand);
               staticCanvas.addCommand(animateCommand);
               staticCanvas.setCommandListener(this);
               display.setCurrent(staticCanvas);
          }
          //view the blank canvas if clear command is selected
          else if (c == eraseCommand) {
               display = Display.getDisplay(this);
               blankCanvas = createBlankCanvas();
               blankCanvas.addCommand(exitCommand);
               blankCanvas.addCommand(viewCommand);
               blankCanvas.setCommandListener(this);
               display.setCurrent(blankCanvas);
          }
          //view the animation canvas if animation command is selected
          else if (c == animateCommand) {
               //Animation canvas
               animationCanvas = createAnimationCanvas();
               animationCanvas.addCommand(exitCommand);
               animationCanvas.addCommand(viewCommand);
               animationCanvas.addCommand(eraseCommand);
               animationCanvas.setCommandListener(this);
               display.setCurrent(animationCanvas);
          }
     }
     //function that is used to create the canvas on which to perform animation
     protected AnimationCanvas createAnimationCanvas() {
          return new AnimationCanvas();
     }
     //function that is used to create the blank graphics canvas
     protected BlankCanvas createBlankCanvas() {
          return new BlankCanvas();
     }
     //function that is used to create the static graphics canvas
     protected StaticCanvas createStaticCanvas() {
          return new StaticCanvas();
     }
     //class used to create the static graphics canvas
     class StaticCanvas extends Canvas {
          //constructor that does nothing
          StaticCanvas() {}
          //overwritten paint method to draw the static graphic (house and sun)
          protected void paint(Graphics g) {
               //paint with the background color
               g.setColor(255,255,255);
               g.fillRect(0,0, getWidth(), getHeight());
               //paint the house, sun, and ground (static)
               g.setColor(0);
               g.fillRect(0, getHeight() - 5, getWidth(), getHeight());
               g.fillArc(40, 50, 20, 20, 0, 360);
               g.drawRect(75, getHeight() - 30, 30, 30);
               g.drawLine(75, getHeight() - 30, 90, getHeight() - 45);
               g.drawLine(90, getHeight() - 45, 105, getHeight() - 30);
          }
     }
     //class used to create the blank graphics canvas
     class BlankCanvas extends Canvas {
          //constructor that does nothing
          BlankCanvas() {}
          //overwritten paint method used to draw a blank canvas
          protected void paint(Graphics g) {
               //paint with the background color
               g.setColor(255,255,255);
               g.fillRect(0,0,getWidth(),getHeight());
          }
     }
     //class used to create the animation canvas
     class AnimationCanvas extends Canvas {
          //size of the sun
          protected static final int SIZE = 20;
          //speed of the sun in the X direction
          protected final int xSpeed = 2;
          //speed of the sun in the Y direction
          protected final int ySpeed = 2;

          //background color
          protected int background = display.isColor() ? 0 : 0xc0c0c0;
          //foreground color
          protected int foreground = display.isColor() ? 0xffff00 : 0;
          //width of the screen
          protected int width = getWidth();
          //height of the screen
          protected int height = getHeight();
          //the sun object
          protected Circle circle;
          //the update timer
          protected Timer timer;
          //the update timer task
          protected TimerTask updateTask;
          //constructs the animation canvas and sets the circle and frame rate
          AnimationCanvas() {
               setCircle();
               setFrameRate();
          }
          //creates the circle object
          public void setCircle() {
               createCircle();
          }
          //calls the start frame timer if the canvas is visible
          public void setFrameRate() {
               if(isShown()) {
                    startFrameTimer();
               }
          }
          //Paint animation canvas and places the circle object in its place
          protected void paint(Graphics g) {
               //paint with the background color
               g.setColor(background);
               g.fillRect(0,0,width,height);
               //draw the house and the sun (at its initial position)
               g.setColor(foreground);
               g.fillRect(0, getHeight() - 5, getWidth(), getHeight());
               g.drawRect(75, getHeight() - 30, 30, 30);
               g.drawLine(75 , getHeight() - 30, 90, getHeight() - 45);
               g.drawLine(90 , getHeight() - 45, 105, getHeight() - 30);
               synchronized(this) {
                    g.fillArc(circle.x, circle.y, SIZE, SIZE, 0, 360);
               }
          }
          //notification that the canvas is visible
          protected void showNotify() {
               //start the frame timer running
               startFrameTimer();
          }
          //notification that the canvas is no longer visible
          protected void hideNotify() {
               //stop the frame timer
               stopFrameTimer();
          }
          //creates the sun to be displayed
          private void createCircle() {
               int startX = 40;
               int startY = 50;
               circle = new Circle(startX, startY, xSpeed, ySpeed);
          }
          //starts the frame redraw timer
          protected void startFrameTimer() {
               timer = new Timer();
               updateTask = new TimerTask() {
                    public void run() {
                         moveCircle();
                    }
               };
               long interval = 1000/frameRate;
               timer.schedule(updateTask, interval, interval);
          }
          //stops the frame redraw timer
          protected void stopFrameTimer() {
               timer.cancel();
          }
          //called when timer expires
          public synchronized void moveCircle() {
               //update the positions and speeds the circle
               circle.move();
               //request a repaint of the screen
               repaint();
          }
          //inner class used to represent a circle on the screen
          class Circle {
               int x; //x position
               int y; //y position
               int xSpeed; //speed in the x direction
               int ySpeed; //speed in the y direction
               //sets the co-ordinates and speed of the circle object when constructed
               Circle(int x, int y, int xSpeed, int ySpeed) {
                    this.x = x;
                    this.y = y;
                    this.xSpeed = xSpeed;
                    this.ySpeed = ySpeed;
               }
               //move the sun to animate it
               void move() {
                    x += xSpeed;
                    if(x<=0 || x - SIZE >= width) {
                         stopFrameTimer();
                    }
                    y += ySpeed;
                    if(y<=0 || y - SIZE >= height) {
                         stopFrameTimer();
                    }
               }
          }
     }
}
--------------------------------------------------------------