对对象的声音效果p5.js

Question

I'm trying to get my stormTrooper image to produce a sound effect when clicked - I'm having no luck so far...I checked the p5.js website - but can't figure it out.

Wondering if I have to include the mousePressed function inside the storm object?

var img;
var trooper;
var sound;

function preload() {

  img = loadImage("stormy3.png");
  sound = loadSound("sounds/Followme.mp3");

}

function setup() {
   // background(255, 0, 0, 0.4);
  background(255, 0, 0, 0.4);
  var myCanvas = createCanvas(windowWidth,windowHeight);
  myCanvas.parent('myContainer');
  myCanvas.position(0, 0);
  trooper = new storm(300,400);
}

function draw() {
 clear();
 trooper.show();
 trooper.movement();
 trooper.bounce();
}

function storm(x,y) {
 this.x = x;
 this.y = y;
 this.xSpeed = 3;
 this.ySpeed = 3;
 this.img = img;

 this.show = function() {
  image(img,this.x,this.y);
};

 this.movement = function() {
   this.x = this.x + this.xSpeed;
   this.y = this.y + this.ySpeed;
};

this.bounce = function() {
  if(this.x > width || this.x < 0) {
    this.xSpeed = this.xSpeed * -1;
}
if(this.y > height || this.y < 0) {
  this.ySpeed = this.ySpeed * -1;
}
};
}

function mousePressed() {

   if (trooper.contains(trooper.x, trooper.y)) {
     sound.play();
   }
}

Answer 1

You wouldn't move the sketch-level mousePressed() function to be inside the Storm object (objects should start with an upper-case letter btw). Instead, you would just call another function inside the Storm object from the sketch-level mousePressed() function.

Also note that your Storm class does not contain a contains() function, so your current code won't work.

Here's a skeleton of what you'd need to do:

function Storm(x, y){
   //other variables and functions here

   this.contains = function(x, y){
      //return true if x,y is inside this Storm's hitbox
   }
}

function mousePressed(){
   if(trooper.contains(someX, someY)){
      //play your sound or do whatever you want
   }
}

You also need to start breaking your problem down into smaller steps . It looks like you're confused about a few different things, so you should ask about each of them in their own question, with their own MCVE that isolates just that step.

For example, can you create a small example sketch that just plays a sound? Get that working perfectly, without worrying about objects or collision detection or anything else. Separately from that, can you create an example program that just handles collision detection, say by changing the color of a rectangle whenever the mouse is inside it? Separately from that, can you create an example program that sets up objects? Get each of those working perfectly by themselves before you start thinking about combining them into one program. Then if you get stuck on a specific step, you can post a MCVE along with a specific question, and we'll go from there. Good luck.