处理 - 如何写; "鼠标点击区域".单击按钮的效果

Question

我想知道为什么这段代码没有按预期工作.

void mousePressed() {

    if (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height)
    { 
        img = loadImage("doraemon.png");
        image(img, 0, 0, width, height);
    }

我想要它,以便当我点击一个显示"下一个"的图像时,我可以在背景上显示不同的图像,如果再次点击,则显示另一个背景图像,依此类推.

if (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height)

^此代码段指出按钮"next"的位置.当我运行此代码时,我将鼠标悬停在条件上时获得图像,但我希望在按下按钮后显示图像.

有谁知道怎么写？

我需要类似的东西

 if (mousePressed == condition)
     { 
      then change image
     }

请帮忙.对此,我真的非常感激!

Answer 1

您试图将所有逻辑塞入该mousePressed()函数中。mousePressed()相反，您需要在函数和函数之间拆分逻辑draw()。使用变量来跟踪应该绘制的内容。调整mousePressed()函数中的这些变量。使用这些变量来确定要在draw()函数中绘制的内容。

一个简单的例子可能如下所示：

boolean showButton1 = true;

void setup() {
  size(200, 200);
}

void mousePressed() {
  if (mouseX < 100 && mouseY < 100) {
    //button 1 was just clicked, show button 2 instead
    showButton1 = false;
  } else if (mouseX > 100 && mouseY > 100) {
    //button 2 was just clicked, show button 1 instead
    showButton1 = true;
  }
}

void draw() {

  background(0);

  if (showButton1) { //draw the first button
    fill(255, 0, 0);
    rect(0, 0, 100, 100);
  } else { //draw the second button
    fill(0, 255, 0);
    rect(100, 100, 100, 100);
  }
}

另外，您不应该loadImage()从mousePressed()或draw()函数调用。相反，从函数加载图像setup()，并将它们存储在稍后可以使用的变量中。