Processing 当我将鼠标移开时，如何一步一步地将矩形的颜色从白色更改为黑色？

我有个问题。当我将鼠标移开时，如何逐步将矩形的颜色从白色更改为黑色？我对这有点陌生

我试过一点：

void设置（）{
规模（200200）；
}
无效提款（）{
背景（0）；
中风（255）；
生产线（100,0100200）；
生产线（010020100）；
//填充黑色
诺斯托克（）；
填充（255）；
//根据鼠标位置，将显示不同的矩形。
if（mouseX<100&&mouseY<100）{
rect（0,0100）；
}否则如果（mouseX>100&&mouseY<100）{
rect（100,0100）；
}否则如果（mouseX<100&&mouseY>100）{
rect（0100）；
}否则如果（鼠标X>100&&mouseY>100）{
rect（100100）；
}
}

如果有人能帮助我，我将不胜感激。

---

谢谢。

如果我理解您的问题，您希望显示一个矩形网格，并且您希望一个矩形在鼠标退出该矩形时变为白色并保持白色。是这样吗

如果是这样，那么您需要跟踪每个矩形是黑色还是白色。最简单的方法可能是

布尔值的2D数组。数组中的每个单元格将表示网格中的一个正方形

当您希望正方形变为白色时，将数组中相应的单元格设置为
true
。然后在数组上循环并使用数组中的值绘制每个正方形，以确定颜色。
调用
fill（255）正在将矩形颜色设置为白色。使用
fill（0）
将矩形设置为黑色，或
填充（x）为

要进行淡入淡出，您需要在每个draw（）调用上绘制多个矩形（绘制所有矩形最简单）。鼠标所在的当前框将为白色。其他人将逐渐变黑。因此，每个框都需要变量来指示其当前颜色

以下是我的版本：

int boxColor1;
int boxColor2;
int boxColor3;
int boxColor4;

void setup () {
  size (200,200);
  boxColor1 = boxColor2 = boxColor3 = boxColor4 = 0;
}

void draw () {
  background (0);

  // Fill a black color
  noStroke ();

  // Subtrack 10 from each box color, but don't go below zero
  boxColor1 = max( 0, boxColor1-10 );
  boxColor2 = max( 0, boxColor2-10 );
  boxColor3 = max( 0, boxColor3-10 );
  boxColor4 = max( 0, boxColor4-10 );

  // Depending on the mouse location, a different rectangle is displayed.    
  if (mouseX < 100 && mouseY < 100) {
    boxColor1 = 255;
  } else if (mouseX > 100 && mouseY < 100) {
    boxColor2 = 255;
  } else if (mouseX < 100 && mouseY > 100) {
    boxColor3 = 255;
  } else if (mouseX > 100 && mouseY > 100) {
    boxColor4 = 255;
  }
  fill (boxColor1);
  rect (0,0,100,100);
  fill (boxColor2);
  rect (100,0,100,100);
  fill (boxColor3);
  rect (0,100,100,100);
  fill (boxColor4);
  rect (100,100,100,100);

  // Draw edge lines last, over the top
  stroke (255);
  line (100,0,100,200);
  line (0,100,200,100);  
}

intboxcolor1；
int-boxColor2；
int-boxColor3；
int-boxColor4；
无效设置（）{
规模（200200）；
boxColor1=boxColor2=boxColor3=boxColor4=0；
}
无效提款（）{
背景（0）；
//填充黑色
诺斯托克（）；
//每个框颜色的子框10，但不要低于零
boxColor1=最大值（0，boxColor1-10）；
boxColor2=最大值（0，boxColor2-10）；
boxColor3=最大值（0，boxColor3-10）；
boxColor4=最大值（0，boxColor4-10）；
//根据鼠标位置，将显示不同的矩形。
if（mouseX<100&&mouseY<100）{
boxColor1=255；
}否则如果（mouseX>100&&mouseY<100）{
boxColor2=255；
}否则如果（mouseX<100&&mouseY>100）{
boxColor3=255；
}否则如果（鼠标X>100&&mouseY>100）{
boxColor4=255；
}
填充（1号框）；
rect（0,0100）；
填充（2号框）；
rect（100,0100）；
填充（3号框）；
rect（0100）；
填充（4号框）；
rect（100100）；
//最后在顶部绘制边缘线
中风（255）；
生产线（100,0100200）；
生产线（010020100）；
}

如果有很多框，您应该使用数组或一些数据结构，而不是许多不同的变量，如
boxColor1
，
boxColor2
等。对不起，我的问题没有那么清楚。当鼠标离开矩形时，我想让它从白色变为黑色。非常感谢，好心的先生。可理解的代码。你帮了我很多！