processing

Fly Swatter in Processing - Almost works


The task is create a fly swatting game in Processing where a fly appears at a random location on the screen, once the fly is swatted it is replaced with the image of a swatted fly, and another fly appears on the screen in a random location. Currently, when the mouse is pressed to swat the fly, multiple flies appear in the window as well (instead of just one). The extra flies that appear in the window also increment the score by 1 for each fly randomly spawned.

I suspect this is has something to do with my arrays, but I'm struggling to find a solution.

I would greatly appreciate some clarity in my errors.

Some screenshots for greater clarity:

Initial screen when starting the game: score: 0 text on top left, black on white background, a black outline illustration of a fly swatter and a single (unswatted) fly to the right.

Swatting one fly. If swatter is within the collision detection of a fly & the fly is being swatted, many fly's then appear on the screen: in addition to the above image there is one swatted fly sprite, however many more unswatted flies (instead of 1)

For as long as a fly has been swatted and the mouse button is being pressed, more fly's keep appearing on the screen, along with the score incrementing with each fly added (but not swatted): similar to the above image, except there are 2 swatted flies and a lot more unswatted flies

PImage fly, flybye, swatter, swatted;
float[] fX, fY; // Declaring fX & fY locaiton arrays
int[] swat;
int score = 0;

void setup() {
  size(800, 400);
  // Images
  fly = loadImage("fly.png");
  fly.resize(50,0);
  flybye = loadImage("flybye.png");
  flybye.resize(50,0);
  swatter = loadImage("swatter.png");  
  swatted = loadImage("swatted.png");
  
  fX = new float[0];
  fY = new float[0];
  swat = new int[0];
  
  fX = append(fX, random(width));
  fY = append(fY, random(height));
  swat = append(swat, 0);
}

void draw() {
  background(255);
  populate(); // Displays flys to the screen
  fill(0);
  textSize(30);
  text("Score: " + score, 20, 50); // Displays the score in the top left corner 
  noCursor(); // Removes the cursor from the screen
  mousePressed(); 
}

void populate() {
  for (int i = 0; i < fX.length; i++) {
    if (swat[i] == 1) { // if swatted
      image(flybye, fX[i], fY[i]);
    } else {
      image(fly, fX[i], fY[i]);
    }
  }
}

void collisionDetect() {
  for (int i = 0; i < swat.length; i++) {
    if (mouseX > fX[i] && mouseX < fX[i] + fly.width &&
        mouseY > fY[i] && mouseY < fY[i] + fly.height) {
          swat[i] = 1;
          fX = append(fX, random(width));
          fY = append(fY, random(height));
          swat = append(swat, 0);
          score++;
          }
  } 
}

void mousePressed() {
  if (mousePressed) {
    collisionDetect();
    image(swatted, mouseX-35, mouseY-25);
  } else {
    image(swatter, mouseX-35, mouseY-25);
  }
}

Solution

  • You're very close, however parts of your code need a closer look as there are a few mistakes:

    if (mouseX > fX[i] && mouseX < fX[i] + fly.width &&
            mouseY > fY[i] && mouseY < fY[i] + fly.height)...
    

    only checks if a fly (any fly, even already swatted) is inside the box. You might want to constrain that further by filtering un-swatted flies only before incrementing score and adding a new fly.

    e.g.

    void collisionDetect() {
      for (int i = 0; i < swat.length; i++) {
        if (mouseX > fX[i] && mouseX < fX[i] + fly.width &&
            mouseY > fY[i] && mouseY < fY[i] + fly.height &&
            // also check this fly has not been swatted (yet)
            swat[i] == 0) {
              swat[i] = 1;
              fX = append(fX, random(width));
              fY = append(fY, random(height));
              swat = append(swat, 0);
              score++;
              }
      } 
    }
    

    This is your code with the above mentions added:

    PImage fly, flybye, swatter, swatted;
    float[] fX, fY; // Declaring fX & fY location arrays
    int[] swat;
    int score = 0;
    
    void setup() {
      size(800, 400);
      // Images
      fly = loadImage("fly.png");
      fly.resize(50,0);
      flybye = loadImage("flybye.png");
      flybye.resize(50,0);
      swatter = loadImage("swatter.png");  
      swatted = loadImage("swatted.png");
      
      fX = new float[0];
      fY = new float[0];
      swat = new int[0];
      
      fX = append(fX, random(width));
      fY = append(fY, random(height));
      swat = append(swat, 0);
    }
    
    void draw() {
      background(255);
      populate(); // Displays flys to the screen
      fill(0);
      textSize(30);
      text("Score: " + score, 20, 50); // Displays the score in the top left corner 
      noCursor(); // Removes the cursor from the screen
    }
    
    void populate() {
      for (int i = 0; i < fX.length; i++) {
        if (swat[i] == 1) { // if swatted
          image(flybye, fX[i], fY[i]);
        } else {
          image(fly, fX[i], fY[i]);
        }
      }
    }
    
    void collisionDetect() {
      for (int i = 0; i < swat.length; i++) {
        if (mouseX > fX[i] && mouseX < fX[i] + fly.width &&
            mouseY > fY[i] && mouseY < fY[i] + fly.height &&
            // also check this fly has not been swatted (yet)
            swat[i] == 0) {
              swat[i] = 1;
              fX = append(fX, random(width));
              fY = append(fY, random(height));
              swat = append(swat, 0);
              score++;
              }
      } 
    }
    
    void mousePressed() {
      collisionDetect();
    }
    

    The other things that could be improved:

    e.g.

    PImage fly, flybye, swatter, swatted;
    float[] fX, fY; // Declaring fX & fY location arrays
    int[] swat;
    int score = 0;
    
    void setup() {
      size(800, 400);
      noCursor(); // Removes the cursor from the screen
      // Images
      fly = loadImage("fly.png");
      fly.resize(50, 0);
      flybye = loadImage("flybye.png");
      flybye.resize(50, 0);
      swatter = loadImage("swatter.png");
      swatted = loadImage("swatted.png");
      
      fX = new float[0];
      fY = new float[0];
      swat = new int[0];
    
      addFly();
    }
    
    void draw() {
      background(255);
      populate(); // Displays flys to the screen
      fill(0);
      textSize(30);
      text("Score: " + score, 20, 50); // Displays the score in the top left corner
    }
    
    void populate() {
      for (int i = 0; i < swat.length; i++) {
        if (swat[i] == 1) { // if swatted
          image(flybye, fX[i], fY[i]);
        } else {
          image(fly, fX[i], fY[i]);
        }
      }
    }
    
    void collisionDetect() {
      for (int i = 0; i < swat.length; i++) {
        if (isPointInRect(mouseX, mouseY, fX[i], fY[i], fly.width, fly.height) &&
          // also check this fly has not been swatted (yet)
          swat[i] == 0) {
          // mark this index as swatted
          swat[i] = 1;
          // increment score
          score++;
          // add new fly
          addFly();
        }
      }
    }
    
    void addFly() {
      fX = append(fX, random(width));
      fY = append(fY, random(height));
      swat = append(swat, 0);
    }
    
    boolean isPointInRect(int mx, int my, float rx, float ry, float rw, float rh) {
      return (mx >= rx && mx <= rx + rw) &&
             (my >= ry && my <= ry + rh);
    }
    
    void mousePressed() {
      collisionDetect();
    }
    

    Take it one step at a time. Sometimes, with code, slowing down/re-checking assumptions will get you over the line faster than rushing. Have fun !