Animation

1
Animation

• To perform animation, we want to call repaint( )
  every few milliseconds
• how does our program know when a few milliseconds
  elapse?
• there is a Timer class available
• set it for 20 milliseconds and every 20
  milliseconds, the Timer generates an ActionEvent
• we implement an ActionListener to handle the
  ActionEvent as we did with JButtons
• ActionEvent is handled by implementing an
  actionPerformed method
• What should our actionPerformed method do?
• we want to draw something on the Graphics panel
  and move it every time the Timer sends out an
  Event
• so actionPerformed will move the object (change
  its location) and then call repaint( ) to redraw
  it on the Graphics panel
• we erase the previous version of whatever was
  drawn by using super.paintComponent(g) first

2
Timer class

• A Timer object is instantiated by
• Timer t new Timer(duration, handler)
• duration is the time (in milliseconds) that
  elapses between Timer-generated events, such as
  20 or 50
• handler is the object that handles the
  Timer-generated events we will use this just
  like we have for our addActionListener statements
• The steps are to add
• import java.awt.event.
• implements ActionListener to our class header
• instantiate the Timer as t new Timer(10, this)
  
• but use whatever value you want for the duration,
  10 or 20 would be adequate for most applications
• start the timer by using t.start( )
• if we need to stop the timer, we use t.stop( )
• thats about all there is to it!

3
TimerSkeleton
import javax.swing. import java.awt.event. pu
blic class TimerSkeleton implements
ActionListener private Timer t // other
instance data go here as needed public
TimerSkeleton( ) t new Timer(10,
this) t.start( ) // other initialization
operations go here as needed // other
methods go here as needed public void
actionPerformed(ActionEvent e) // whatever
you want to happen when the Timer pulses go
here
4
What Should actionPerformed Do?

• This depends on why you are using a Timer
• to move an object in a Graphics panel (e.g., a
  ball)
• alter the x and y coordinates and call repaint( )
• for a Game
• calculate where game objects (say a spacecraft or
  a missile) have moved and redraw them
• this may require the user of an array of x and an
  array of y values to store the various objects,
  or multiple variables such as myX, myY, yourX,
  yourY, or both (the arrays might store the X and
  Y coordinates of missiles launched from one to
  the other)
• for Animation
• if our item being drawn is represented by an
  array of different figures
• then just increment the array index and repaint(
  )
• we will see an example of a StickFigure, but this
  could also be done by having a series of jpg or
  gif files all pre-loaded into an array of Images

5
Moving an Image to Create Motion

• Imagine that your class draws on a JPanel an
  ImageIcon (say of a spaceship)
• currently, the spaceship is located at
  coordinates x, y
• the following actionPerformed method will
  randomly move the spaceship on the screen
• x and y should be class variables so that you
  could do g.drawImage(image, x, y, this) in your
  paintComponent method

public void actionPerformed(ActionEvent e)
int dx generator.nextInt(2) // generate a
from -1 to 1 int dy generator.nextInt(2
) // generate a from -1 to 1 x
dx // move the piece in a random x direction
y dy // move the piece in a random y
direction repaint( ) // assume repaint
does drawImage at x, y
6
Full Example Code
public TimerExample( ) t new Timer(10,
this) t.start( ) x 150 y 150
repaint( ) public void actionPerformed(ActionEv
ent ev) int distanceX generator.nextInt(2))
int distanceY generator.nextInt(2)) x
distanceX y distanceY repaint(
) public void paintComponent(Graphics
g) super.paintComponent(g) g.setColor(Color.r
ed) g.fillOval(x, y, 5, 5)
At each Timer Event, randomly move the object (a
red circle) up/down/left/right by 0 or 1
unit Note we could make it more realistic by
generating a random int from 1-9 and move it in
one of 8 directions or leave it stationary (1
upper left, or subtract 1 from x and y, 2
straight up, etc)
7
Handling Multiple ActionEvents
private static class ExamplePanel extends JPanel
implements ActionListener private Timer
t private JButton b public ExamplePanel(
) t new Timer(1000, this) t.start()
b new JButton("Button") b.addActionListen
er(this) add(b) public void
actionPerformed(ActionEvent e) if(e.getSour
ce( )t) System.out.println("Timer
pulsed") else if(e.getSource(
)b) System.out.println("Button
pressed")
8
Moving Multiple Items

• How would a game like Asteroids work?
• we need to keep track of the ltx, ygt coordinates
  of multiple values, just like we did with our
  paint program
• so we create an array of x, y, dx and dy int
  values
• private int x, y, dx, dy // dx, dy velocity
  of x, y
• private int num // number of items in the arrays
• actionPerformed now manipulates all items in the
  array and paintComponent draws them all

public void actionPerformed(ActionEvent e)
for(int i0iltnumi) xidxi
yidyi
If xi or yi reaches a boundary (0 or max
X/Y) then change dx or dy to be the opposite
(multiply by -1)