by James Patterson. Press the mouse button to change animations. Demonstrates loading, displaying, and animating GIF images. It would be easy to write a program to display animated GIFs, but would not allow as much control over the display sequence and rate of display.
Original Processing.org Example: AnimatedSprite
// All Examples Written by Casey Reas and Ben Fry
// unless otherwise stated.
/* @pjs preload="data/PT_Shifty_0000.gif, data/PT_Shifty_0001.gif, data/PT_Shifty_0002.gif,
data/PT_Shifty_0003.gif, data/PT_Shifty_0004.gif, data/PT_Shifty_0005.gif,
data/PT_Shifty_0006.gif, data/PT_Shifty_0007.gif, data/PT_Shifty_0008.gif,
data/PT_Shifty_0009.gif, data/PT_Shifty_0010.gif, data/PT_Shifty_0011.gif,
data/PT_Shifty_0012.gif, data/PT_Shifty_0013.gif, data/PT_Shifty_0014.gif,
data/PT_Shifty_0015.gif, data/PT_Shifty_0016.gif, data/PT_Shifty_0017.gif,
data/PT_Shifty_0018.gif, data/PT_Shifty_0019.gif, data/PT_Shifty_0020.gif,
data/PT_Shifty_0021.gif, data/PT_Shifty_0022.gif, data/PT_Shifty_0023.gif,
data/PT_Shifty_0024.gif, data/PT_Shifty_0025.gif, data/PT_Shifty_0026.gif,
data/PT_Shifty_0027.gif, data/PT_Shifty_0028.gif, data/PT_Shifty_0029.gif,
data/PT_Shifty_0030.gif, data/PT_Shifty_0031.gif, data/PT_Shifty_0032.gif,
data/PT_Shifty_0033.gif, data/PT_Shifty_0034.gif, data/PT_Shifty_0035.gif,
data/PT_Shifty_0036.gif, data/PT_Shifty_0037.gif, data/PT_Teddy_0000.gif,
data/PT_Teddy_0001.gif, data/PT_Teddy_0002.gif, data/PT_Teddy_0003.gif,
data/PT_Teddy_0004.gif, data/PT_Teddy_0005.gif, data/PT_Teddy_0006.gif,
data/PT_Teddy_0007.gif, data/PT_Teddy_0008.gif, data/PT_Teddy_0009.gif,
data/PT_Teddy_0010.gif, data/PT_Teddy_0011.gif, data/PT_Teddy_0012.gif,
data/PT_Teddy_0013.gif, data/PT_Teddy_0014.gif, data/PT_Teddy_0015.gif,
data/PT_Teddy_0016.gif, data/PT_Teddy_0017.gif, data/PT_Teddy_0018.gif,
data/PT_Teddy_0019.gif, data/PT_Teddy_0020.gif, data/PT_Teddy_0021.gif,
data/PT_Teddy_0022.gif, data/PT_Teddy_0023.gif, data/PT_Teddy_0024.gif,
data/PT_Teddy_0025.gif, data/PT_Teddy_0026.gif, data/PT_Teddy_0027.gif,
data/PT_Teddy_0028.gif, data/PT_Teddy_0029.gif, data/PT_Teddy_0030.gif,
data/PT_Teddy_0031.gif, data/PT_Teddy_0032.gif, data/PT_Teddy_0033.gif,
data/PT_Teddy_0034.gif, data/PT_Teddy_0035.gif, data/PT_Teddy_0036.gif,
data/PT_Teddy_0037.gif, data/PT_Teddy_0038.gif, data/PT_Teddy_0039.gif,
data/PT_Teddy_0040.gif, data/PT_Teddy_0041.gif, data/PT_Teddy_0042.gif,
data/PT_Teddy_0043.gif, data/PT_Teddy_0044.gif, data/PT_Teddy_0045.gif,
data/PT_Teddy_0046.gif, data/PT_Teddy_0047.gif, data/PT_Teddy_0048.gif,
data/PT_Teddy_0049.gif, data/PT_Teddy_0050.gif, data/PT_Teddy_0051.gif,
data/PT_Teddy_0052.gif, data/PT_Teddy_0053.gif, data/PT_Teddy_0054.gif,
data/PT_Teddy_0055.gif, data/PT_Teddy_0056.gif, data/PT_Teddy_0057.gif,
data/PT_Teddy_0058.gif, data/PT_Teddy_0059.gif"; */
Animation animation1, animation2;
float xpos, ypos;
float drag = 30.0;
void setup() {
size(200, 200);
background(255, 204, 0);
frameRate(24);
animation1 = new Animation("PT_Shifty_", 38);
animation2 = new Animation("PT_Teddy_", 60);
}
void draw() {
float difx = mouseX - xpos;
if (abs(difx) > 1.0) {
xpos = xpos + difx/drag;
xpos = constrain(xpos, 0, width);
}
// Display the sprite at the position xpos, ypos
if (mousePressed) {
background(153, 153, 0);
animation1.display(xpos-animation1.getWidth()/2, ypos);
} else {
background(255, 204, 0);
animation2.display(xpos-animation1.getWidth()/2, ypos);
}
}
// Class for animating a sequence of GIFs
class Animation {
PImage[] images;
int imageCount;
int frame;
Animation(String imagePrefix, int count) {
imageCount = count;
images = new PImage[imageCount];
for (int i = 0; i < imageCount; i++) {
// Use nf() to number format 'i' into four digits
String filename = "data/" + imagePrefix + nf(i, 4) + ".gif";
images[i] = loadImage(filename);
}
}
void display(float xpos, float ypos) {
frame = (frame+1) % imageCount;
image(images[frame], xpos, ypos);
}
int getWidth() {
return images[0].width;
}
}