Hi, so I have been pulling my hair out trying to animate a PImage (technically a PGraphics object) onto screen with Ani controlling the X and Y Co-ords.

After struggling with this I popped in an ellipse instead of my PImage and PRESTO! Ani works like magic.... Printing the animated variables shows they are changing but for some reason the PImage is invisible.... What is going on here?  In the sketch below you can see both the ellipse and the PImage are being animated but when you run it only the ellipse is shown.

Any guesses at the cause would be highly appreciated!



SKETCH BELOW ====================

import de.looksgood.ani.*;
import de.looksgood.ani.easing.*;

Badge myBadge;

void setup () {
 size (720,640);
 smooth();
 Ani.init(this);
 myBadge = new Badge ();
  
}

void draw () {
  background (255);
  image (myBadge.badgebuf, myBadge.xpos, myBadge.ypos);
  fill (0);
  ellipse (myBadge.xpos + 5, myBadge.ypos + 5, 20, 20);
}

void mouseClicked () {
   myBadge.triggerMove(width/2, height/2);  
}

//=============================================================

abstract class UI {
 
  float xpos;
  float ypos;
 
 UI (float _xpos, float _ypos) {
xpos = _xpos;
ypos = _ypos;
 }
 
  void triggerMove (int _targetX, int _targetY) {
   Ani.to(this, 1.5, "xpos", _targetX, Ani.QUINT_IN_OUT);
   Ani.to(this, 1.5, "ypos", _targetY, Ani.QUINT_IN_OUT);
   println ("triggered");
  }
}

//==============================================================

class Badge extends UI {

  //I create a off screen buffer to generate my badge on.
  PGraphics badgebuf = createGraphics(110,110,JAVA2D);  

  Badge () {

    super ( -100,  -100);
    buildBadge();
  }


  void buildBadge () {
//This should draw a red circle onto my buffer
    badgebuf.beginDraw();
    badgebuf.fill(255,0,0,100);
    badgebuf.ellipse (width/2, height/2, 100, 100);
    badgebuf.endDraw();
  }

}