Previous | Next | Trail Map | Creating a User Interface | Working with Graphics


Displaying a Sequence of Images

This page features the same animation that you see in the Trail Map: our mascot, Duke, waving. The example on this page gives you the basics of displaying an image sequence. The next section has hints for improving the appearance and performance of this animation. This page shows only applet code. The code for an application would be similar, except you would use different code to load the images, as described in Loading Images.

Below are the ten images this applet uses.

T1.gif: T2.gif: T3.gif: T4.gif: T5.gif:
T6.gif: T7.gif: T8.gif: T9.gif: T10.gif:

Here's the applet in action. Remember that you can click on the applet to stop or start the animation.


Your browser can't run 1.0 Java applets. If it could, you'd see Duke waving at you.

The code for this example is even simpler than for the previous example, which moved an image. Here is the code that differs from the moving image example:

. . .//Where instance variables are declared:
Image duke[10];

. . .//In the init() method:
for (int i = 1; i <= 10; i++) {
    images[i-1] = getImage(getCodeBase(),
                               "../../../images/duke/T"+i+".gif");
}

. . .//In the update() method, instead of calling drawFrame():
offGraphics.drawImage(images[frameNumber % 10], 0, 0, this);


Previous | Next | Trail Map | Creating a User Interface | Working with Graphics