JavaRanch Home    
This page:         last edited 09 October 2007         What's Changed?         Edit

Code Barn Hello Anim Thread First   

You must turn on Java for applets to work.

IMPORTANT: This is the first in a series of four applet examples for animation. The other three are HelloAnimThreadA?, HelloAnimThreadB?, and HelloAnimThreadC?. Make sure you understand this example before moving on.

ALSO IMPORTANT: This is not the ideal way to animate. It flickers and is not entirely smooth. In HelloAnimThreadB? and C, you will see an improved technique which builds on the example below but adds a few new features.

Explanation of HelloAnimThreadFirst? applet

Number of classes: 1 (HelloAnimThreadFirst?.class)

What it does: Animates a small rectangle across the screen once

How to do animation in Java:

You have two choices for animation:

1) Display a series of different images (as you often do with gif animations)


2) Display just a single image, but keep updating that image's location on the screen

Of course, you can combine the two methods, as we did with the moving cows in the Roundup game... there are four different "looks" (different .gif files) for each cow, but the cows also move across the screen.

In this animation series of applets, we draw a rectangle on the screen using a method of the Graphics class, rather than drawing a .gif image.

Animation Overview for this applet:

For 40 iterations, update / change the x and y coordinates of a rectangle and then repaint it in the new location. To the user, this will appear as a moving rectangle.


  1. Define instance variables for the rectangles size and x,y screen coordinates (which represent the top left corner of the rectangle)
  2. Implement a run() method (did we mention that this applet implements the runnable interface? You'll see why in a minute...). This run method will contain a loop which will iterate 40 times.
  3. In the run method, update the x and y instance variables so the rectangle will be drawn at a new location
  4. At the end of the run method, call repaint() (a method the applet can respond to). Repaint will ultimately lead to the applet's paint() method being called. Don't call paint directly! In HelloThreadAnimB? and C, you will be calling paint, but it can only be called under special circumstances you'll look at in those other examples.
  5. Override the paint() method, and give it something to do: Draw the rectangle in a new position, using the instance variables for x, y and the size (height and width) of the rectangle.
  6. Be sure to create and start a Thread object at the end of the init method.


// Very Simple Animation -- start with this code-- 
// series continues through HelloAnimThreadC 

import java.awt.* ;
import java.applet.Applet ;

public class HelloAnimThreadFirst extends Applet implements Runnable 
    private int imageHeight , imageWidth ;  //size of animating rectangle
    private int currX , currY ;  // left,top corner of rectangle
    public void init() 
        imageHeight = 25 ;
        imageWidth = 40 ; 
        // set up starting position
        currX = 30 ;
        currY = 30 ;
        // create and start the thread
        Thread animator = new Threadthis );
    } //close init
    public void run() 
        // update location of the rectangle 40 times, and call repaint each time
        for ( int i = 0 ; i <= 40 ; i++ ) 
                Thread.sleep( 30 );
            catch ( InterruptedException e ) 
            // update the x and y coordinates for the rectangle
            currX = currX + 3 ;
            currY = currY + 3 ; 
            // now call repaint which will ultimately lead to paint being called 
        } //close for loop 
    } //close run
    public void paint( Graphics g ) 
        g.drawRect( currX , currY , imageWidth , imageHeight );
    } // close paint
// close class


JavaRanchContact us — Copyright © 1998-2014 Paul Wheaton