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 will give you the basics of animating images. The next few pages will have 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 [somewhere else]).

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);

Working with Graphics