animation, I cant the animation to work even with the libary installed

gamenex

I was trying to use the ghost sprite from SP4 to get an animation going on the game

    import gifAnimation.*;

    float circleX = 200;
    float circleY = 182;
    float circleSize = 47; 
    float Bittysize = 2;
    int total = 0;

    PImage bimg;
    PImage iitty;
    PImage Gif;


    Ghost[] ghost = new Ghost[1000];



    void setup() { 
      size(620, 400);

      Gif myAnimation = new Gif(this, "animation2.png");
    myAnimation.loop();
      bimg = loadImage("hauntedhousejpg.jpg");


    image(myAnimation, 10,10);

      iitty = loadImage("hats2.png");
      for (int i = 0; i < ghost.length; i++) {
        ghost[i] = new Ghost(33);
      }
    }



    void draw() {
    image(myAnimation, 10,10);
    background(bimg);

      for (int i = 0; i < total; i++) {
        ghost[i].display();
        ghost[i].ghostMovement();
      }



      fill(#14A523);
      ellipse(circleX, circleY, circleSize, circleSize);        
      image(iitty, mouseX, mouseY, 30, 30);
      if ( dist(circleX, circleY, mouseX, mouseY) < ((circleSize/2) + (Bittysize/2)) ) {
        circleX = circleX = random(0, 380);
        circleY = circleY = random(0, 380);
        total = total +1;
      }
    }

Chrisir

this makes no sense

void draw() {
image(myAnimation, 10,10);
background(bimg);

Chrisir

I see PImage Gif; but also Gif myAnimation ?

this must be a global var Gif myAnimation; and not defined in draw()

in draw(): myAnimation = new Gif(this, "animation2.png");

without Gif before

gamenex

no is not working here is the format im suppose to follow but I wonder how will this work inside classed

gamenex

import gifAnimation.*;

DISPLAYING A GIF ANIMATION:

The class to access/display GIF animations is called Gif. It has two possibilities to access the frame pixel data:

Extract all frames of an animated Gif into a PImage[] array using the static method "getPImages()". you need to pass a reference to the PApplet and a filename to it. The file should be in the sketch data folder. This method is useful if you just want to mess with the frames yourself and don't need the playback possibilities. The method is static, so you have no separate thread going.

``    PImage[] allFrames = Gif.getPImages(this, "lavalamp.gif");``

The second way to acces the animation is to play it like a video. This will play the animation with the frame delays specified in the GIF file. Gif extends PImage, so any instance of Gif fits wherever PImage can be used. Create a new Gif object

Gif myAnimation = new Gif(PApplet parent, String filename);

In a sketch this would look like this:

    void setup() {
    size(400,400);
        Gif myAnimation = new Gif(this, "lavalamp.gif");
    myAnimation.play();
    }

    void draw() {
    image(myAnimation, 10,10);
    }

gamenex

I tried his made examples and now they are not working, means something is wrong with his codes?

Chrisir

Gif myAnimation ;

void setup() {
    size(400,400);
    myAnimation = new Gif(this, "lavalamp.gif");
    myAnimation.play();
}

void draw() {
     image(myAnimation, 10,10);
}

gamenex

cris did you try it? or guessing?

gamenex

i got a class not found Gif, thats why I asked

gamenex

i got nuller point excecption

PhiLho

1. You won't see an animation with the line:
   Gif myAnimation = new Gif(this, "animation2.png");
   because you need to load Gif images: PNG are static images!

2. As Chrisir said, at the end of setup(), myAnimation disappear, and draw() references a non-existing variable. See the articles in Common Questions, particularly What are setup() and draw()?.

gamenex

I did the gif as well, but I found out that my pics were not stay in the data folder, so I had to do alot of deleting, once I did that it fixed the issue. Still I tried this only with a still gif, I will now try it with animated shortly.

gamenex

got it to work now how the heck i get it in a class?

Chrisir

show your entire code, what is the Ghost class?

gamenex

        // GHOST CLASS 

        class Ghost {
          float ghostX; 
          float ghostY; 
          float ghostSize; 
          float moveX; 
          float moveY; 
          PImage Gimg = loadImage("ghost2.gif");

          Ghost(float movement) {
            ghostX = random(350);
            ghostY = random(350);
            ghostSize = 20;
            moveX = random(0.03, 2.3);
            moveY = random(0.009, 2.3);
          }

          void display() {

            strokeWeight(0);
            textSize(66);
            fill(#ED970C);
            text(total, 25, 60);
            image(Gimg,ghostX,ghostY);


          }

          void ghostMovement() {

            ghostX = ghostX + moveX;
            ghostY = ghostY + moveY;
            if ((ghostX > 600 || ghostX < -1)) {   
              moveX = - moveX;
            }
            if ((ghostY > 380 ||ghostY < -1)) {
              moveY = - moveY;
            }
          }
        }

gamenex

Thank you Cris and others for the help.

There is the class code on top

Chrisir

and now you want to make a class for the circle?

it is similar to the ghost class - but smaller

did you write the ghost class yourself?

;-)

gamenex

no I wanna know how can I get the animated image in this class since its the ghost image. This image I have in there now is not animated.

Yeah I wrote this code, from watching tutorial videos, I might have to rewatch them just keep practicing but I was trying to get this game done.

Chrisir

so the lines that manage that and are outside the class need to be inside the class

so in the class there is display()

here you want image(myAnimation, 10,10);

in the class instead of

PImage Gimg = loadImage("ghost2.gif");

write

myAnimation = new Gif(this, "lavalamp.gif");
myAnimation.play();

where you define myAnimation : this belongs inside the class

etc.

;-)

gamenex

    // GHOST CLASS 

    class Ghost {
      float ghostX; 
      float ghostY; 
      float ghostSize; 
      float moveX; 
      float moveY; 
      myAnimation = new Gif(this, "ghost4.gif");
      myAnimation.loop();

      Ghost(float movement) {
        ghostX = random(350);
        ghostY = random(350);
        ghostSize = 20;
        moveX = random(0.03, 2.3);
        moveY = random(0.009, 2.3);
      }

      void display() {

        strokeWeight(0);
        textSize(66);
        fill(#ED970C);
        text(total, 25, 60);
        image(myAnimation, 10, 10);
      }

      void ghostMovement() {

        ghostX = ghostX + moveX;
        ghostY = ghostY + moveY;
        if ((ghostX > 600 || ghostX < -1)) {   
          moveX = - moveX;
        }
        if ((ghostY > 380 ||ghostY < -1)) {
          moveY = - moveY;
        }
      }
    }

gamenex

so I did it like this and got unexpected token for myAnimation

Chrisir

myAnimation must be in the class too

put this after line 12 above

  myAnimation = new Gif(this, "ghost4.gif");
  myAnimation.loop();

The thing is that "this" probably refers to the class instead of to the sketch.

you need to pass this as a parameter to the constructor (var in the constr being sketchReference or so)

and then change the 2 lines to

  myAnimation = new Gif(sketchReference, "ghost4.gif");
  myAnimation.loop();

;-)

gamenex

can you please show me with my code cause I really dont understand, sorry

Chrisir

post your entire code

gamenex

    float circleX = 200;
    float circleY = 182;
    float circleSize = 47; 
    float Bittysize = 2;
    int total = 0;

    /* @pjs preload="hauntedhousejpg.jpg"; */
    PImage bimg;
    PImage iitty;
    PImage Gimg;


    Ghost[] ghost = new Ghost[1000];



    void setup() { 
      size(620, 400);
      bimg = loadImage("hauntedhousejpg.jpg");

      imageMode(CENTER);


      iitty = loadImage("hats2.png");
      for (int i = 0; i < ghost.length; i++) {
        ghost[i] = new Ghost(33);
      }
    }



    void draw() {

    background(bimg);

      for (int i = 0; i < total; i++) {
        ghost[i].display();
        ghost[i].ghostMovement();
      }



      fill(#14A523);
      ellipse(circleX, circleY, circleSize, circleSize);        
      image(iitty, mouseX, mouseY, 30, 30);
      if ( dist(circleX, circleY, mouseX, mouseY) < ((circleSize/2) + (Bittysize/2)) ) {
        circleX = circleX = random(0, 380);
        circleY = circleY = random(0, 380);
        total = total +1;
      }
    }
    // GHOST CLASS 

    class Ghost {
      float ghostX; 
      float ghostY; 
      float ghostSize; 
      float moveX; 
      float moveY; 
      PImage Gimg = loadImage("ghost4.gif");

      Ghost(float movement) {
        ghostX = random(350);
        ghostY = random(350);
        ghostSize = 20;
        moveX = random(0.03, 2.3);
        moveY = random(0.009, 2.3);
      }

      void display() {

        strokeWeight(0);
        textSize(66);
        fill(#ED970C);
        text(total, 25, 60);
        image(Gimg,ghostX,ghostY);


      }

      void ghostMovement() {

        ghostX = ghostX + moveX;
        ghostY = ghostY + moveY;
        if ((ghostX > 600 || ghostX < -1)) {   
          moveX = - moveX;
        }
        if ((ghostY > 380 ||ghostY < -1)) {
          moveY = - moveY;
        }
      }
    }

gamenex

I gave you a working code, but it dont have animation

gamenex

When the game is up, Im going to have you credit in this game at least for the help your giving me.

Chrisir

I can't run the sketch because I don't have the lib and the images

Chrisir

import gifAnimation.*;  // ????????????

float circleX = 200;
float circleY = 182;
float circleSize = 47; 
float Bittysize = 2;
int total = 0;

/* <a href="/two/profile/pjs">@pjs</a> preload="hauntedhousejpg.jpg"; */
PImage bimg;
PImage iitty;
// PImage Gimg;   // ??????????

Ghost[] ghost = new Ghost[1000];

// ----------------------------------------------

void setup() { 
  size(620, 400);
  bimg = loadImage("hauntedhousejpg.jpg");

  imageMode(CENTER);

  iitty = loadImage("hats2.png");
  for (int i = 0; i < ghost.length; i++) {
    ghost[i] = new Ghost(33, this);
  }
} 

void draw() {

  background(bimg);

  for (int i = 0; i < total; i++) {
    ghost[i].display();
    ghost[i].ghostMovement();
  }

  fill(#14A523);
  ellipse(circleX, circleY, circleSize, circleSize);        
  image(iitty, mouseX, mouseY, 30, 30);

  if ( dist(circleX, circleY, mouseX, mouseY) < ((circleSize/2) + (Bittysize/2)) ) {
    circleX = circleX = random(0, 380);
    circleY = circleY = random(0, 380);
    total = total +1;
  }
}

// ==================================================================
// GHOST CLASS 

class Ghost {
  float ghostX; 
  float ghostY; 
  float ghostSize; 
  float moveX; 
  float moveY; 

  // PImage Gimg = loadImage("ghost4.gif");  // ???? 
  PImage myAnimation;                        // ????

  Ghost(float movement, PApplet sketchReference ) {
    ghostX = random(350);
    ghostY = random(350);
    ghostSize = 20;
    moveX = random(0.03, 2.3);
    moveY = random(0.009, 2.3);
    // ????
    myAnimation = new Gif(sketchReference, "ghost4.gif");  // ????
    myAnimation.loop();
  }

  void display() {
    strokeWeight(0);
    textSize(66);
    fill(#ED970C);
    text(total, 25, 60);
    image(myAnimation, ghostX, ghostY);
  }

  void ghostMovement() {

    ghostX = ghostX + moveX;
    ghostY = ghostY + moveY;
    if ((ghostX > 600 || ghostX < -1)) {   
      moveX = - moveX;
    }
    if ((ghostY > 380 ||ghostY < -1)) {
      moveY = - moveY;
    }
  }
} // class

//

Chrisir

as you can see I put ???? where I am not sure what's going on....

Is it Gif myAnimation; or is it PImage myAnimation; etc. ?

Chrisir

don't credit me, it's fine

;-)

gamenex

you cant get it to work either right?

Chrisir

generic speaking:

when all the ghosts use the same graphik (gif) it is obviously wise to load it in setup and provide it as a global var (saves a lot of time and hard drive)

since I don't know how the lib for the gifs works, I chose this way.

Reason: we want all the ghosts animation be in an different state of the animation otherwise it would look dumb

but maybe you can reach this goal and still load only one image...

Question

can you instead of

myAnimation = new Gif(sketchReference, "ghost4.gif"); // ????

say

myAnimation = new Gif(sketchReference, myGlobalGifImage); // ????

and load myGlobalGifImage in setup() as a global var?

;-)

Chrisir

??

I don't have the lib and the images!

otherwise I could make it work

;-)

Chrisir

what error do you get?

let's hunt the beast down!

gamenex

ha ha ok, let me play with it a bit and see how I can tackle this. Im trying something different now

gamenex

if you want we can do a join me session, where you can see what I am doing and communicate be much faster to tackle the issue.

gamenex

Cris did help me with the issue and now its closed, I have to figure how to do some of it on my own, and Cris thanks again. I will put your name on my site. Thank you

gamenex

I think ur right cris, I might have to find a way to put it on setup cause calling it is makeing the pc slow down and is eating memory

Chrisir

yeah.