How can I make Images disappear upon collision

Lizzbet

Hello!

I am trying to write a little game. Its a cats paw on the cursor and there are mice running around (both inserted as images). I was trying to find out, how the mice would disappear upon collision and a mouse click with the cats paw. any help maybe?

PImage pfote;         // Deklarieren der Pfote
PImage foto;          // Deklarieren von Holzboden
PImage maus;          // Deklarieren der Maus  

PFont f;                       // Deklaration der Variablen für den Font von der Klasse PFont
String lauftext[] = {          // Deklaration des Strings für den Lauftext

  "Ist die Katze doch im Haus, rennt die Maus."
     };

float t;            //Position des Lauftextes
int txt_nr =0;

float[] x = new float[5], y = new float[5],   // Mäuse: Deklaration der Arrays für 
        vx = new float[5], vy = new float[5]; // die Position und Geschwindigkeit


void setup() {                         // Beginn Void Setup

  size(852, 900);  // Grösse des Fotos
  f=createFont("Times New Roman", 16, true);
  t=width;                             // Start des Textes ist rechts 

  pfote = loadImage ("pfote.gif");     // Bild laden der Pfote
  maus = loadImage("maus.gif");        // Bild laden der Maus        
  foto = loadImage("holz.jpg");        // Bild Laden des Holzbodens

  for (int i=0; i<5; i++) {            // Mäuse: for-Schleife für die Initialisierung 
     vx[i] = random(15);               // der Geschwindigkeiten in x- und y-Richtung
     vy[i] = random(15);               // (vx[i] ist Geschwindigleit von der Maus i in x-Richtung)

  } // end for i


   frameRate(25);

} // end setup


void draw() {             // Beginn Void Draw

  background(foto);       // Das Objekt 'foto', der Holzboden wird als Hintergrund verwendet
  fill(0);
  imageMode (CENTER);
  image (pfote, mouseX, mouseY, 100, 120); // Bild der Pfote positionieren


// Anzeige des Textes  von Text [ txt_nr  ] an der Position x

  textFont(f, 25);
  textAlign(LEFT);
  text(lauftext[txt_nr], t, 810);
  t = t - 5;                      // Dekrementieren von t   
                                  // Wenn x kleiner als -Textbreite ist, verschwindet der Text links
                                  // und beginnt wieder rechts

  float w = textWidth(lauftext[txt_nr]);        // Feststellen der Textlänge

  if (t < -w) { 
    t= width;                                   // Wenn Text links weg geht, start rechts festlegen                  
    txt_nr = (txt_nr + 1)%lauftext.length;      // Textnummer um 1 erhöhen

  }
  if ( txt_nr > 2 ) {
    txt_nr = 0;
  }                                       // Falls Meldungsnummer zu gross ist, 
                                          // wieder bei 0 beginnen.

for (int i=0; i<5; i++) {                 // for-Schleife für die Aktualiserung des Arrays

     x[i] = x[i] + vx[i];                 // Berechnung der neuen x-Position von Ball i
     y[i] = y[i] + vy[i];                 // Berechnung der neuen y-Position von Ball i

     // Abprall an den Wänden. Sobald die Bälle i ausserhalb des Zeichenbereichs sind,
     // wird die x- bzw. y-Geschwindigkeit in Gegenrichtung gekehrt.

     if ((x[i]>width) || (x[i]<0)) { vx[i] = -vx[i]; } 
     if ((y[i]>400) || (y[i]<0)) { vy[i] = (-1)*vy[i]; } 

     image(maus, x[i],  y[i], 50, 50); // Foto der mäuse einfügen




}
} // end void draw

Poersch

Try the following code (the changes are commented):

PImage pfote;         // Deklarieren der Pfote
PImage foto;          // Deklarieren von Holzboden
PImage maus;          // Deklarieren der Maus  
 
PFont f;                       // Deklaration der Variablen für den Font von der Klasse PFont
String lauftext[] = {          // Deklaration des Strings für den Lauftext
 
  "Ist die Katze doch im Haus, rennt die Maus."
     };
 
float t;            //Position des Lauftextes
int txt_nr =0;

int maeuse = 10;    //Anzahl der Mäuse
 
float[] x = new float[maeuse], y = new float[maeuse],   // Mäuse: Deklaration der Arrays für 
        vx = new float[maeuse], vy = new float[maeuse]; // die Position und Geschwindigkeit
 
void setup() {                         // Beginn Void Setup
 
  size(852, 900);  // Grösse des Fotos
  f=createFont("Times New Roman", 16, true);
  t=width;                             // Start des Textes ist rechts 
 
  pfote = loadImage ("pfote.gif");     // Bild laden der Pfote
  maus = loadImage("maus.gif");        // Bild laden der Maus        
  foto = loadImage("holz.jpg");        // Bild Laden des Holzbodens
 
  for (int i=0; i<maeuse; i++) {            // Mäuse: for-Schleife für die Initialisierung 
     vx[i] = random(15);               // der Geschwindigkeiten in x- und y-Richtung
     vy[i] = random(15);               // (vx[i] ist Geschwindigleit von der Maus i in x-Richtung)
 
  } // end for i
 
 
   frameRate(25);
 
} // end setup
 
 
void draw() {             // Beginn Void Draw
 
  background(foto);       // Das Objekt 'foto', der Holzboden wird als Hintergrund verwendet
  fill(0);
  imageMode (CENTER);
  image (pfote, mouseX, mouseY, 100, 120); // Bild der Pfote positionieren
 
 
// Anzeige des Textes  von Text [ txt_nr  ] an der Position x
 
  textFont(f, 25);
  textAlign(LEFT);
  text(lauftext[txt_nr], t, 810);
  t = t - 5;                      // Dekrementieren von t   
                                  // Wenn x kleiner als -Textbreite ist, verschwindet der Text links
                                  // und beginnt wieder rechts
 
  float w = textWidth(lauftext[txt_nr]);        // Feststellen der Textlänge
 
  if (t < -w) { 
    t= width;                                   // Wenn Text links weg geht, start rechts festlegen                  
    txt_nr = (txt_nr + 1)%lauftext.length;      // Textnummer um 1 erhöhen
 
  }
  if ( txt_nr > 2 ) {
    txt_nr = 0;
  }                                       // Falls Meldungsnummer zu gross ist, 
                                          // wieder bei 0 beginnen.
 
for (int i=0; i<maeuse; i++) {                 // for-Schleife für die Aktualiserung des Arrays
 
     x[i] = x[i] + vx[i];                 // Berechnung der neuen x-Position von Ball i
     y[i] = y[i] + vy[i];                 // Berechnung der neuen y-Position von Ball i
 
     // Abprall an den Wänden. Sobald die Bälle i ausserhalb des Zeichenbereichs sind,
     // wird die x- bzw. y-Geschwindigkeit in Gegenrichtung gekehrt.
 
     if ((x[i]>width) || (x[i]<0)) { vx[i] = -vx[i]; } 
     if ((y[i]>400) || (y[i]<0)) { vy[i] = (-1)*vy[i]; } 


     // Wenn Computer-Maus gedrückt und Pfote über Maus i, töte die Maus
     // (Tausche Maus i mit der letzten "lebenden" Maus und verringere die Anzahl der Mäuse um 1)
     if(mousePressed && mouseX + 100 > x[i] && mouseX < x[i] + 50 && mouseY + 120 > y[i] && mouseY < y[i] + 50) {
         maeuse--;
         x[i] = x[maeuse];
         y[i] = y[maeuse];
         vx[i] = vx[maeuse];
         vy[i] = vy[maeuse];
         i--;
         continue;
     }
        
     image(maus, x[i],  y[i], 50, 50); // Foto der mäuse einfügen
 
}
} // end void draw

Lizzbet

Wow thats great! thanks! I kept on working on the project and I added the codes. still doesn't seem to work… it gives me an Out of bounds error.

// mmp13b, Lisa Müller
// Fang die Mäuse :P // 12.01.2014

                        // Deklaration eines Objektes vom Type PIamge
  PImage pfote;         // Deklarieren der Pfote
  PImage Hintergrund1; // Deklarieren von Hintergrund1
  PImage Hintergrund2; // Deklarieren von Hintergrund2
  PImage Hintergrund3; // Deklarieren von Hintergrund3
  PImage Hintergrund4; // Deklarieren von Hintergrund4
  PImage bg;   // Deklarieren von hintergrund

 Controler myCont; //Timer deklarieren

  PImage maus;          // Deklarieren der Maus 

   Ball ball1;          // Deklarieren der Bälle 
   Ball ball2;
   Ball ball3;
   Ball ball4;





  PFont f;                       // Deklaration der Variablen für den Font von der Klasse PFont
  PFont schrift;
  String lauftext[] = {          // Deklaration des Strings für den Lauftext




    "Achtung! Die Mäuse kannst du nicht! Drücke die Taste 1-4 um den Hintergrund zu wechseln"
       };

  float t;            //Position des Lauftextes
  int txt_nr =0;

  int maeuse = 10;    //Anzahl der Mäuse

  float[] x = new float[5], y = new float[5],       // Mäuse: Deklaration der Arrays für 
          vx = new float[5], vy = new float[5];     // die Position und Geschwindigkeit

  color col;

  void setup() {                         // Beginn Void Setup

    size(500, 500);  // Grösse des Fotos
    smooth();        // Abgerundete Kanten

    schrift = loadFont("Serif-48.vlw"); //Laden der Schrift für den Timer

    for (int i=0; i<maeuse; i++) {            // Mäuse: for-Schleife für die Initialisierung 
     vx[i] = random(15);               // der Geschwindigkeiten in x- und y-Richtung
     vy[i] = random(15);               // (vx[i] ist Geschwindigleit von der Maus i in x-Richtung)


    minim = new Minim(this);      // Musikfile laden, 2048 samples lang
    player = minim.loadFile("meow.mp3", 2048); 
    player.play(); //abspielen

    myCont = new Controler (60);

  // Bälle Initialisieren

    ball1 = new Ball(50);
    ball2 = new Ball(30);
    ball3 = new Ball(40);
    ball4 = new Ball(60);




    f=createFont("Times New Roman", 16, true);
    t=width;                             // Start des Textes ist rechts


    pfote = loadImage ("pfote.gif");     // Bild laden der Pfote
    maus = loadImage("maus.gif");        // Bild laden der Maus        
    Hintergrund1 = loadImage("Hintergrund1.jpg");        // Bild Laden des Holzbodens
    Hintergrund2 = loadImage("Hintergrund2.jpg");
    Hintergrund3 = loadImage("Hintergrund3.jpg");
    Hintergrund4 = loadImage("Hintergrund4.jpg");
    bg = Hintergrund1;
    background(bg);



  } // end for i




     frameRate(25); //Geschwindigkeit, Frames pro Sekunde


  }// ende setup


  void draw() { // Beginn Void Draw


    background (bg);                  // Hintergrund als bg definiert  

    switch(key)
   {
     case '1':
     bg = Hintergrund1;
        background(bg); // Drücke Taste 1 - Das Objekt 'Hintergrund1' wird als Hintergrund verwendet

     break;

     case '2':            
     bg = Hintergrund2;   
        background(bg); // Drücke Taste 2 - Das Objekt 'Hintergrund2' wird als Hintergrund verwendet

     break;

     case '3':
     bg = Hintergrund3;
        background(bg); // Drücke Taste 3 - Das Objekt 'Hintergrund3' wird als Hintergrund verwendet

     break;

     case '4':
     bg = Hintergrund4;
        background(bg); // Drücke Taste 4 - Das Objekt 'Hintergrund4' wird als Hintergrund verwendet

     break;
   }

    fill(0);                             //Schrift farbe ist schwarz


    //Text
    textFont(f, 40);                 //Schrift f, Grösse 25
    textAlign(LEFT);                 // Text ist linksbündig
    text(lauftext[txt_nr], t, 350);  // Dekrementieren von t   
                                      // Wenn t kleiner als -Textbreite ist, verschwindet der Text links
    t = t - 5;                                                           
    float w = textWidth(lauftext[txt_nr]);        // Feststellen der Textlänge
    if (t < -w) { 
      t= width;                                   // Wenn Text links weg geht, start rechts festlegen                  
      txt_nr = (txt_nr + 1)%lauftext.length;      // Textnummer um 1 erhöhen   
    }
    if ( txt_nr > 2 ) {                          // Falls Meldungsnummer zu gross ist, 
                                                // wieder bei 0 beginnen.
      txt_nr = 0;
    }     


 // For Schleife Mäuse
  for (int i=0; i<5; i++) {                 // for-Schleife für die Aktualiserung des Arrays

       x[i] = x[i] + vx[i];                 // Berechnung der neuen x-Position von Maus i
       y[i] = y[i] + vy[i];                 // Berechnung der neuen y-Position von Maus i


       if ((x[i]>width) || (x[i]<0)) { vx[i] = -vx[i]; }       // Abprall an den Wänden. Sobald die Mäuse i ausserhalb des Zeichenbereichs sind,

       if ((y[i]>height) || (y[i]<0)) { vy[i] = (-1)*vy[i]; } // wird die x- bzw. y-Geschwindigkeit in Gegenrichtung gekehrt.

       // Wenn Computer-Maus gedrückt und Pfote über Maus i, töte die Maus
     // (Tausche Maus i mit der letzten "lebenden" Maus und verringere die Anzahl der Mäuse um 1)
     if(mousePressed && mouseX + 100 > x[i] && mouseX < x[i] + 50 && mouseY + 120 > y[i] && mouseY < y[i] + 50) {
         maeuse--;
         x[i] = x[maeuse];
         y[i] = y[maeuse];
         vx[i] = vx[maeuse];
         vy[i] = vy[maeuse];
         i--;
         continue;    
     }

        image(maus, x[i],  y[i],50, 50); //Mäuse einfügen
  }//ende for-Schleife


  //Timer
  myCont.run(); //Timer: Grösse, Farbe
  fill(0); // keine Füllfarbe
  if(myCont.getTime() > 0)

  {
  textFont(schrift,36); //Schrift und Schriftgrösse 
  fill(220,150,250); // Farbe des Kreises in dem der Timer ist
  noStroke();  //Kein Rand um den Timer
  ellipse(30,height-30,50,70);//Position der Zahlen im Timer Kreis
  fill(0);
  text(str(myCont.getTime()),10,height-10);
  } 
  else {

    textFont(schrift,50);  //Schriftart und Grösse wenn Zeit hinüber ist
    fill(255,0,0); //Farbe 
    text("Die Zeit ist um :(",100,height/2); //Text in der Mitte auf Spielfläche


  print("Fertig gespielt!"); //Textausgabe auf der Konsole
  noLoop();  

  }

//Pfote auf der Maus
  image (pfote, mouseX, mouseY, 90, 90);       // Bild der Pfote positionieren
  imageMode (CENTER);              // Mauscursor befondet sich in der Mitte des Bildes

//Bälle 
  ball1.move();        //4 3Bälle aktivieren
        ball2.move();
        ball3.move();
        ball4.move();
        ball1.display();
        ball2.display();
        ball3.display();
        ball4.display();

} // end void draw

Lizzbet

Error:

Exception in thread "Animation Thread" java.lang.ArrayIndexOutOfBoundsException: 5 at sketch_dec28a.setup(sketch_dec28a.java:76) at processing.core.PApplet.handleDraw(PApplet.java:1608) at processing.core.PApplet.run(PApplet.java:1530) at java.lang.Thread.run(Thread.java:695)

PhiLho

Which line is highlighted?

Lizzbet

I solved the Problem. It Works now. How can I make it re-run the game and music if the timer is over?

// mmp13b, Lisa Müller                  
// Fang die Mäuse :P
// 12.01.2014


                             // Deklaration eines Objektes vom Type PIamge
  PImage pfote;              // Deklarieren der Pfote
  PImage Hintergrund1;       // Deklarieren von Hintergrund1
  PImage Hintergrund2;       // Deklarieren von Hintergrund2
  PImage Hintergrund3;       // Deklarieren von Hintergrund3
  PImage Hintergrund4;       // Deklarieren von Hintergrund4
  PImage bg;                 // Deklarieren von hintergrund

 Controler myCont;               //Timer deklarieren, bennant myCont

  PImage maus;                    // Deklarieren der Maus 

   Ball ball1;                    // Deklarieren der Bälle 1-4
   Ball ball2;
   Ball ball3;
   Ball ball4;
   Ball ball5;



  // zum Text
  PFont f;                       // Deklaration der Variablen für den Font von der Klasse PFont, benannt f
  PFont schrift;                 // zweite Schrift, benannt schrift, für den Timer
  String lauftext[] = {          // Deklaration des Strings für den Lauftext

    "Fang die Mäuse! Drücke die Taste 1-4 um den Hintergrund zu wechseln"
       };

  float t;            //Position des Lauftextes
  int txt_nr =0;      // Initialisierung bei 0

  //Mäuse
  int maeuse = 20;    //Anzahl der Mäuse
  float[] x = new float[maeuse], y = new float[maeuse],       // Mäuse: Deklaration der Arrays für 
          vx = new float[maeuse], vy = new float[maeuse];     // die Position und Geschwindigkeit

  //VOID SETUP
  void setup() {                         

    size(500, 500);  // Grösse des Fotos, der Hintergrundbilder auch.
    smooth();        // Abgerundete Kanten bei gezeichneten Objekten

    schrift = loadFont("Serif-48.vlw"); //Laden der Schrift für den Timer

    minim = new Minim(this);                       // Musikfile laden, 2048 samples lang
    player = minim.loadFile("meow.mp3", 2048); 
    player.play();                               //abspielen

    myCont = new Controler (30);                 //Länge des Timers

  // Bälle Initialisieren
    ball1 = new Ball(20);    
    ball2 = new Ball(15);
    ball3 = new Ball(10);
    ball4 = new Ball(15);
    ball5 = new Ball(10);




    f=createFont("Times New Roman", 16, true);
    t=width;                             // Start des Textes ist rechts


    pfote = loadImage ("pfote.gif");     // Bild laden der Pfote
    maus = loadImage("maus.gif");        // Bild laden der Maus        
    Hintergrund1 = loadImage("Hintergrund1.jpg");        // Bild Laden des Holzbodens
    Hintergrund2 = loadImage("Hintergrund2.jpg");
    Hintergrund3 = loadImage("Hintergrund3.jpg");
    Hintergrund4 = loadImage("Hintergrund4.jpg");
    bg = Hintergrund1;
    background(bg);


    for (int i=0; i<maeuse; i++) {            // Mäuse: for-Schleife für die Initialisierung 
     vx[i] = random(15);               // der Geschwindigkeiten in x- und y-Richtung
     vy[i] = random(15);               // (vx[i] ist Geschwindigleit von der Maus i in x-Richtung)

  } // end for i


     frameRate(25); //Geschwindigkeit, Frames pro Sekunde


  }// ende setup


  void draw() { // Beginn Void Draw


    background (bg);                  // Hintergrund als bg definiert  

    switch(key)
   {
     case '1':
     bg = Hintergrund1;//bg wird zu Hintergrund1
        background(bg); // Drücke Taste 1 - Das Objekt 'Hintergrund1' wird als Hintergrund verwendet

     break;

     case '2':            
     bg = Hintergrund2;   //bg wird zu Hintergrund2
        background(bg); // Drücke Taste 2 - Das Objekt 'Hintergrund2' wird als Hintergrund verwendet

     break;

     case '3':
     bg = Hintergrund3;//bg wird zu Hintergrund3
        background(bg); // Drücke Taste 3 - Das Objekt 'Hintergrund3' wird als Hintergrund verwendet

     break;

     case '4':
     bg = Hintergrund4; //bg wird zu Hintergrund4
        background(bg); // Drücke Taste 4 - Das Objekt 'Hintergrund4' wird als Hintergrund verwendet

     break;
   }

    fill(0);                             //Schrift farbe ist schwarz


    //Text
    textFont(f, 40);                 //Schrift f, Grösse 25
    textAlign(LEFT);                 // Text ist linksbündig
    text(lauftext[txt_nr], t, 350);  // Dekrementieren von t   
                                      // Wenn t kleiner als -Textbreite ist, verschwindet der Text links
    t = t - 5;                                                           
    float w = textWidth(lauftext[txt_nr]);        // Feststellen der Textlänge
    if (t < -w) { 
      t= width;                                   // Wenn Text links weg geht, start rechts festlegen                  
      txt_nr = (txt_nr + 1)%lauftext.length;      // Textnummer um 1 erhöhen   
    }
    if ( txt_nr > 2 ) {                          // Falls Meldungsnummer zu gross ist,  // wieder bei 0 beginnen.                             
      txt_nr = 0;
    }     


 // For Schleife Mäuse
  for (int i=0; i<maeuse; i++) {                 // for-Schleife für die Aktualiserung des Arrays

       x[i] = x[i] + vx[i];                 // Berechnung der neuen x-Position von Maus i
       y[i] = y[i] + vy[i];                 // Berechnung der neuen y-Position von Maus i


       if ((x[i]>width) || (x[i]<0)) { vx[i] = -vx[i]; }       // Abprall an den Wänden. Sobald die Mäuse i ausserhalb des Zeichenbereichs sind,

       if ((y[i]>height) || (y[i]<0)) { vy[i] = (-1)*vy[i]; } // wird die x- bzw. y-Geschwindigkeit in Gegenrichtung gekehrt.


     // Komplizierte Funktion    
     // Wenn Computer-Maus gedrückt ist, und Pfote über der Maus i, wird die Maus getötet/ verschwindet
     // (Maus wird mit der letzten "lebenden" Maus ausgetauscht und verringert die Anzahl der Mäuse um 1)
     // Wie gross ist der Umkreis von der Maus X-Position und der Maus Y-Position, dass bei einem Click die Mäuse verschwinden
     if(mousePressed && mouseX + 20 > x[i] && mouseX < x[i] + 50 && mouseY + 20 > y[i] && mouseY < y[i] + 50) {
         maeuse--;
         x[i] = x[maeuse];
         y[i] = y[maeuse];
         vx[i] = vx[maeuse];
         vy[i] = vy[maeuse];
         i--;
         continue;    
     }

        image(maus, x[i],  y[i], 40, 40); //Mäuse einfügen
  }//ende for-Schleife


  //Timer
  myCont.run(); //Timer: Grösse, Farbe
  fill(0); // keine Füllfarbe
  if(myCont.getTime() > 0)
  {
  textFont(schrift,36); //Schrift und Schriftgrösse 
  fill(220,150,250); // Farbe des Kreises in dem der Timer ist
  noStroke();  //Kein Rand um den Timer
  ellipse(30,height-20,40,60);//Position der Zahlen im Timer Kreis
  fill(0);
  text(str(myCont.getTime()),10,height-10);
  } 
  else {
    textFont(schrift,50);  //Schriftart und Grösse wenn Zeit hinüber ist
    fill(255,0,0); //Farbe 
    text("Die Zeit ist um :(",100,height/2); //Text in der Mitte auf Spielfläche
  print("Fertig gespielt!"); //Textausgabe auf der Konsole
  noLoop();  
  }

//Pfote auf der Maus
  image (pfote, mouseX, mouseY, 90, 90);       // Bild der Pfote positionieren
  imageMode (CENTER);                          // Mauscursor befondet sich in der Mitte des Bildes

//Bälle 
  ball1.move();                //4 3Bälle aktivieren
  ball2.move();          // Bälle bewegen      
  ball3.move();
  ball4.move();
  ball5.move();
  ball1.display();
  ball2.display();
  ball3.display();
  ball4.display();
  ball5.display();

} // end void draw