AnimationWorld -- Animations

Animations are created by extending the Animation class. Only one method, initializeAnimation() needs to be implemented. Inside this method, we can set properties for the Animation as well as add Sprites and signal when they should appear/disappear, be active/inactive. Methods that we can use fall into four categories.

Methods that set properties of the animation

setFps(int newFps)
Sets the frames per second for this animation. The default is 12 fps.
setNumberFrames(int frames)
Sets the number of frames in this animation. The default is 60 frames. To specify that the animation does not have a limit to the number of frames, use the constant Animation.NO_MAX_FRAMES
setNumberRepeats(int repeats)
Sets the number of times this animation should be repeated. The default is 0. To specify that the animation should loop forever (unless stopped by the user), use the constant Animation.FOREVER
setFrameSize(int width, int height)
Sets the size of the animation frame and makes the animation frame non-resizeable. The animation frame should be smaller than the "screen" it is being projected on. This is dependent on the AnimationPlayer used and the size of the applet as specified in the HTML page. The Animation Player will center the animation frame on the screen of the applet. The default animation frame size is the size of the "screen" in the applet. By default the animation frame size changes as the user shrinks or expands the applet area (like when using AppletViewer, but not possible typically in web browsers), but specifying a size via this method makes the animation frame non-resizeable. Width and height are specified in pixels.

Note that there are two ways above to make an animation play "forever". An animation can either loop a sequence of frames, or it can just not have an end. For the second option, there is no concept of a "frame number" attached to the frames (may be an issue in debugging). Even if an animation is set to play "forever", it will be stopped every time the user leaves the animation. Animation Players can be configured to restart the animation when the user returns.

Methods that allow us to add Sprites to the animation

addSprite(Sprite s)
Add Sprite to the animation.
addSprite(Sprite s, String name)
Add Sprite to the animation and give the Sprite a name. Names may be used in some animation players and are helpful for debugging (assuming one has written toString and getState methods which include a call to getName).

The order that Sprites are added to the animation determine the order that they are rendered on the frame. Remember that objects that are drawn later appear over objects that are drawn before.

Methods that allow us to control individual Sprites in the animation

Sprites have three characteristics that can be toggled. They can either be active or inactive, visible or hidden, debugged or not. By default, Sprites are both active and visible starting from the first frame with debug off. When a characteristic is toggled, it remains in its toggled state until it is toggled again. The information provided by the methods below are stored as instances of a Cue class in Java.

setActive (Sprite s, int frameNumber)
Set the Sprite to be active in the given frame.
setVisible (Sprite s, int frameNumber)
Set the Sprite to be visible in the given frame.
setActiveAndVisible (Sprite s, int frameNumber)
Set the Sprite to be active and visible in the given frame.
setInactive (Sprite s, int frameNumber)
Set the Sprite to be inactive in the given frame.
setHidden (Sprite s, int frameNumber)
Set the Sprite to be hidden in the given frame.
setInactiveAndHidden (Sprite s, int frameNumber)
Set the Sprite to be inactive and hidden in the given frame.
setActiveAndVisibleRange (Sprite s, int startFrameNumber, int endFrameNumber)
Set the Sprite to be active and visible in the given frames inclusive. The Sprite is set to be inactive and hidden after the endFrameNumber.
setInactiveAndHiddenRange (Sprite s, int startFrameNumber, int endFrameNumber)
Set the Sprite to be inactive and hidden in the given frames inclusive. The Sprite is set to be active and visible after the endFrameNumber.

Methods that allow us to debug the animation

Debugging an animation involves printing out the toString and getState methods when the Sprites are displayed in each frame. The toString method is invoked when the Sprite is in its initial state. The getState method is invoked when the Sprite is not in its initial state. By default debug mode is off. Debug messages are generally printed to stdout when using AppletViewer and to the Java Console for web browsers.

setDebugOn()
Prints the state of the animation each time a frame is painted. This includes the state of all Sprites and a list of all cues.
setDebugOn (Sprite s, int frameNumber)
Set the Sprite to be in debug mode in the given frame.
setDebugOff (Sprite s, int frameNumber)
Set the Sprite to not be in debug mode in the given frame.
setDebugRange (Sprite s, int startFrameNumber, int endFrameNumber)
Set the Sprite to be in debug mode in the given frames inclusive. The Sprite is set to not be in debug mode after the endFrameNumber

The methods above can be in the initializeAnimation method in any order. The only exceptions are that the order that Sprites are added to the animation determine the order they are rendered in the animation frame, and if two conflicting cues are given for any point in time (ie set a sprite to be active and inactive in a certain frame), the latter cue specified takes precedence.

Examples

Examples are shown below. Each animation would be in its own file named after the name of the animation class. All six animations can be seen in the BuggleShowcase. The name of the choice in the BuggleShowcase is followed by the code for the animation which is displayed when that choice is selected.

RightBuggle choice
Add one Sprite to the animation.

import java.awt.*; // use colors

public class BuggleAnimation1 extends Animation {
  
  public void initializeAnimation () {
    RightBuggle s1 = new RightBuggle(Color.blue, 36, 0, 0, 2);
    addSprite(s1, "s1");
  }
  
}

RightLeftBuggle choice
Add two Sprites to animation and set number of frames and fix frame size.

import java.awt.*; // use colors

public class BuggleAnimation2 extends Animation {
  
  public void initializeAnimation () {
    setNumberFrames(100);
    setFrameSize(400,120);
    RightBuggle s1 = new RightBuggle(Color.blue, 36, 0, 0, 2);
    RightLeftBuggle s2 = new RightLeftBuggle(Color.green, 48, 200, 50, -20);
    addSprite(s1, "s1");
    addSprite(s2, "s2");
  }
  
}

SpyBuggle choice

import java.awt.*; // use colors

public class BuggleAnimation3 extends Animation {
  
  public void initializeAnimation () {
    setFps(20);
    setNumberFrames(100);
    setFrameSize(450,150);
    RightBuggle s1 = new RightBuggle(Color.blue, 36, 0, 0, 2);
    RightLeftBuggle s2 = new RightLeftBuggle(Color.green, 48, 200, 50, -20);
    SpyBuggle s3 = new SpyBuggle(Color.yellow, 24, 400, 100, 25);
    addSprite(s1, "s1");
    addSprite(s2, "s2");
    addSprite(s3, "s3");
  }
  
}

SpyArmy choice
Backgrounds are Sprites, too. An animation with a solid color background. Note that we can say
Sprite s1 = new RightBuggle(...)
because a RightBuggle is a kind of Sprite. This is known as upcasting. Upcasting is fine as long as we don't invoke any special (non-Sprite) methods on the Sprite.

import java.awt.*; // use colors

public class BuggleAnimation4 extends Animation {
  
  public void initializeAnimation () {
    setFps(20);
    setNumberFrames(100);
    setFrameSize(400,350);
    
    Sprite background = new ColorBackground(Color.gray);
    addSprite(background, "background");
    
    Sprite s1 = new RightBuggle(Color.blue, 36, 0, 0, 2);
    Sprite s2 = new RightLeftBuggle(Color.green, 48, 200, 50, -20);
    Sprite s3 = new SpyBuggle(Color.yellow, 24, 350, 100, 25);
    Sprite s4 = new SpyArmy(3, Color.red, 60, 100, 130, 15);
    addSprite(s1, "s1");
    addSprite(s2, "s2");
    addSprite(s3, "s3");
    addSprite(s4, "s4");
  }
  
}

SpyArmyII and SpyArmyIII choices
Animations are objects, too! We can create animations which change depending on parameter values.

import java.awt.*; // use colors

public class BuggleAnimation5 extends Animation {

  private Color c1; // color for background
  private Color c2; // color for RightBuggle
  private Color c3; // color for RightLeftBuggle
  private Color c4; // color for SpyBuggle
  private Color c5; // color for SpyArmy
  
  public BuggleAnimation5 () {
    this.c1 = Color.black;
    this.c2 = Color.blue;
    this.c3 = Color.green;
    this.c4 = Color.yellow;
    this.c5 = Color.red;
  }
  
  public BuggleAnimation5 (Color c1, Color c2, Color c3, Color c4, Color c5) {
    this.c1 = c1;
    this.c2 = c2;
    this.c3 = c3;
    this.c4 = c4;
    this.c5 = c5;
  }  
  
  public void initializeAnimation () {
    setNumberFrames(100);
    Sprite background = new ColorBackground(c1);
    Sprite s1 = new RightBuggle(c2, 36, 0, 0, 2);
    Sprite s2 = new RightLeftBuggle(c3, 48, 200, 50, -20);
    Sprite s3 = new SpyBuggle(c4, 24, 400, 100, 25);
    Sprite s4 = new SpyArmy(3, c5, 60, 100, 130, 15);
    addSprite(background, "background");
    addSprite(s1, "s1");
    addSprite(s2, "s2");
    addSprite(s3, "s3");
    addSprite(s4, "s4");
  }
  
}

BugglesInAndOut choice
This animation illustrates toggling characteristics of Sprites throughout the animation. We show the effect of disappearing and reappearing Sprites and how to have different backgrounds at different times in the animation.

import java.awt.*; // use colors

public class BuggleAnimation6 extends Animation {
  
  public void initializeAnimation () {
    // set properties of animation
    setFps(15);             // set frames per second
    setNumberFrames(90);    // set number of frames

    // first background
    Sprite background1 = new ColorBackground(Color.black);
    addSprite(background1, "background1");
    setHidden(background1,30);
        
    // second background
    Sprite background2 = new ColorBackground(Color.blue);
    addSprite(background2, "background2");
    setHidden(background2,1);
    setActiveAndVisibleRange(background2,30,59);
        
    // third background
    Sprite background3 = new ColorBackground(Color.green);
    addSprite(background3, "background3");
    setHidden(background3,1);
    setVisible(background3,60);
    
    Sprite s1 = new SpyBuggle(Color.cyan, 50, 60, 150, 5);
    addSprite(s1, "s1");
    
    Sprite s2 = new SpyArmy(5, Color.magenta, 25, 150, 200, -20);
    addSprite(s2, "s2");
    setInactiveAndHiddenRange(s2,1,20);
    setHidden(s2,80);
    
    Sprite s3 = new SpyBuggle(Color.yellow, 40, 350, 20, -15);
    addSprite(s3, "s3");
    setHidden(s3,40);
    setVisible(s3,60);
    
    Sprite s4 = new SpyArmy(2, Color.red, 30, 100, 280, 25);
    addSprite(s4, "s4");
    setHidden(s4,25);
    setVisible(s4,55);
  }
  
}

AnimationWorld
Sprites
Animations
Animation Players
HTML pages