How do I make an image detect collision with another image to change something?

So, I am trying to make a demo of an app for school. I want a hat (hat) to be detected as colliding with a head (lisa0) and to then have the background change permanently so I can move on to having other things happen. Trouble is, once the mouse moves away from the "hit zone" everything reverts to as it was.

What am I doing wrong? It is probably glaringly obvious but I am stumped and have been for over four hours!!!

PImage bG0;                                           
PImage bG1; 
PImage lisa0;
PImage lisa1;
PImage lisa2;
PImage hat;

int x = 255;
int y = 491;


void setup() { 
  size(1000, 729); 

  bG0 = loadImage("bg0.png");                           
  bG1 = loadImage("bg1.png"); 
  lisa0 = loadImage("Lisa1.png");
  lisa1 = loadImage("LisaHelmet.png");
  hat = loadImage("Hat.png");

  }

void draw(){   
  cursor(HAND);
  image(bG0, 0, 0);                                   
  lisa0.resize(200, 300);
  image(lisa0, 150, 450);
  lisa1.resize(200, 300);


  if(mousePressed){
    image(hat, mouseX - 150, mouseY - 80);
  }


  println(mouseX, mouseY);


  if(dist(x,y,mouseX,mouseY)<=70){  
  image(bG1, 0, 0);
  lisa0 = lisa1;
  image(lisa1, 150, 450);     
}

}
Tagged:

Answers

Sign In or Register to comment.