Animation 如何在重画时保留现有图形

我不太熟悉处理。我试图画一条线，从我控制的“球”经过的最后一个矩形到它经过的下一个矩形。我几乎已经知道了，但是我不知道应该如何重新排列代码，使行保持最后，而不是被背景的重画所覆盖，或者在绘制的每个实例中都被绘制

这是我到目前为止所拥有的。只需使用前两个矩形进行测试：

int radius, directionX, directionY, x1;
int previousX, previousY, currentX, currentY, a, b, c, d;
float x, y, speed;

void setup () {
  size (500,500);
  smooth ();
  noStroke();  
  background(255);

  directionY = 0;
  directionX = 1;
  radius = 30;

  previousX = -1;
  previousY = -1;
  currentX = 0;
  currentY = 0;

  a = 20;
  b = 20; 
  c = 20; 
  d = 20;

  x= 30;
  y= 30;
  speed = 2;
}

void draw () {
  int n1= 75;
  int n2= 325;
  int l= 100;

  background(255); 
  stroke(4);

  fill(25,81,139,a);
  rect(n1,n1,l,l);

  if((x>n1) && (x<(n1+100)) && (y>n1) && (y<n1+100)){
     a=a+ 1;
     fill(25,81,139,a);
     rect(n1,n1,l,l);

     currentX = 125;
     currentY = 125;
       if(previousX>0 && previousY>0) {
         line(previousX,previousY,currentX, currentY);
       }
    }
       previousX = 125;
       previousY = 125;   

  fill(25,81,139,b);
  rect(n1,n2,l,l);

  if((x>n1) && (x<(n1+100)) && (y>(n2)) && (y<(n2+100))){
     b=b+ 1;
     fill(25,81,139,a);
     rect(n1,n2,l,l);
     currentX = 125;
     currentY = 325;
       if(previousX>0 && previousY>0){
         line(previousX,previousY,currentX, currentY);
       }
       previousX = 125;
       previousY = 325;  

    }    

  fill(25,81,139,c);
  rect(n2,n1,l,l);

  fill(25,81,139,d); 
  rect(n2,n2,l,l);

  x=x+speed*directionX;
  y=y+speed*directionY;

  //boundaries
  if ((x>width-radius) || (x<radius)){
    directionX= -directionX;}

  if ((y>height-radius) || (y<radius)){
    directionY= -directionY;}  

 fill(255);
 stroke(0);
 strokeWeight(1);
 ellipse(x,y,radius,radius);   
}      
void keyPressed()   //movement ===========================================================
{
  if (key == CODED)
  {
    if (keyCode == DOWN)
    {
      directionX=0;
      directionY=1;
    }
    else if (keyCode == UP)
    {
      directionX=0;
      directionY=-1;
    }
    else if (keyCode == LEFT)
    {
      directionX= -1;
      directionY= 0;
    }
    else if (keyCode == RIGHT)
   {
     directionX= 1;
     directionY= 0;
   }
  }
}

int半径，方向x，方向y，x1；
int previousX，Previous，currentX，currentY，a，b，c，d；
浮动x，y，速度；
无效设置（）{
尺寸（500500）；
平滑（）；
仰泳（）；
背景（255）；
方向y=0；
方向x=1；
半径=30；
previousX=-1；
先前=-1；
电流x=0；
电流y=0；
a=20；
b=20；
c=20；
d=20；
x=30；
y=30；
速度=2；
}
无效提款（）{
int n1=75；
int n2=325；
int l=100；
背景（255）；
中风（4）；
填充（2581139，a）；
rect（n1，n1，l，l）；
如果（（x>n1）&&（xn1）&&&（y0&&先前>0）{
行（previousX，previousY，currentX，currentY）；
}
}
previousX=125；
先前的=125；
填充（25,81139，b）；
rect（n1，n2，l，l）；
如果（（x>n1）&&（x（n2））&&&（y0&&先前>0）{
行（previousX，previousY，currentX，currentY）；
}
previousX=125；
先前的=325；
}    
填充（25,81139，c）；
rect（n2，n1，l，l）；
填充（25,81139，d）；
rect（n2，n2，l，l）；
x=x+速度*方向x；
y=y+速度*方向y；
//界限
如果（（x＞宽度半径）＞（x高半径）＞（y＜p＞），不幸的是，我不知道要防止什么东西被调用到<代码>背景（255）< /代码>。您可能不会考虑<代码>背景（255）< /C> >不设置背景颜色，而是使用指定的颜色清除屏幕。

如果您担心在每一个实例中都会重新绘制，那么从性能角度来看，这通常不是一个大问题

如果只需要清除屏幕的一部分，当然可以手动绘制该部分，但如果确实需要在不清除重叠区域的情况下清除区域，则可能需要研究如何使用创建单独的层，或者类似以下的库：（如果你能让它工作的话。在我开始其他解决方案之前，我只是让它自己工作了一点）我认为这解决了您的问题，我对每次椭圆在正方形中时检查的条件添加了一些更改，并且我始终保持最后和当前位置，在绘制函数的末尾，我绘制了与此位置对应的线

int radius, directionX, directionY, x1;
int previousX, previousY, currentX, currentY, a, b, c, d;
float x, y, speed;

void setup () {
  size (500,500);
  smooth ();
  noStroke();  
  background(255);

  directionY = 0;
  directionX = 1;
  radius = 30;

  previousX = -1;
  previousY = -1;
  currentX = 0;
  currentY = 0;

  a = 20;
  b = 20; 
  c = 20; 
  d = 20;

  x= 30;
  y= 30;
  speed = 2;
}

void draw () {
  int n1 = 75;
  int n2 = 325;
  int l = 100;

  background(255); 
  stroke(4);

  fill(25,81,139,a);
  rect(n1,n1,l,l);

  //Up rigth square
  if((x>n1) && (x<(n1+100)) && (y>n1) && (y<n1+100)){
     a=a+ 1;
     fill(25,81,139,a);
     rect(n1,n1,l,l);

     if(currentX != 125 || currentY != 125){
       previousX = currentX;
       previousY = currentY;
     }
     currentX = 125;
     currentY = 125;
  }

  fill(25,81,139,b);
  rect(n1,n2,l,l);

  //Bottom rigth square
  if((x>n1) && (x<(n1+100)) && (y>(n2)) && (y<(n2+100))){
     b=b+ 1;
     fill(25,81,139,a);
     rect(n1,n2,l,l);

     if(currentX != 125 || currentY != 325){
       previousX = currentX;
       previousY = currentY;
     }
     currentX = 125;
     currentY = 325;     
  }

  fill(25,81,139,c);
  rect(n2,n1,l,l);

  fill(25,81,139,d); 
  rect(n2,n2,l,l);

  x=x+speed*directionX;
  y=y+speed*directionY;

  //boundaries
  if ((x>width-radius) || (x<radius)){
    directionX= -directionX;}

  if ((y>height-radius) || (y<radius)){
    directionY= -directionY;}  

  //Here we draw the line bettwen squares
  if(previousX > 0 && previousY > 0 && 
    currentX > 0 && currentY > 0)
    line(previousX,previousY,currentX, currentY);

 fill(255);
 stroke(0);
 strokeWeight(1);
 ellipse(x,y,radius,radius);

}

void keyPressed()   //movement ===========================================================
{
  if (key == CODED){
    if (keyCode == DOWN){

      directionX=0;
      directionY=1;

    }
    else if (keyCode == UP){
      directionX=0;
      directionY=-1;
    }
    else if (keyCode == LEFT){
      directionX= -1;
      directionY= 0;
    }
    else if (keyCode == RIGHT){
     directionX= 1;
     directionY= 0;
   }
  }

}

int半径，方向x，方向y，x1；
int previousX，Previous，currentX，currentY，a，b，c，d；
浮动x，y，速度；
无效设置（）{
尺寸（500500）；
平滑（）；
仰泳（）；
背景（255）；
方向y=0；
方向x=1；
半径=30；
previousX=-1；
先前=-1；
电流x=0；
电流y=0；
a=20；
b=20；
c=20；
d=20；
x=30；
y=30；
速度=2；
}
无效提款（）{
int n1=75；
int n2=325；
int l=100；
背景（255）；
中风（4）；
填充（2581139，a）；
rect（n1，n1，l，l）；
//右上角广场
如果（（x>n1）和&（xn1）和&（yn1）和&（x（n2））和&（ywidth半径）| | |（xheight半径）| |（y 0和以前的>0和&）
currentX>0&¤tY>0）
行（previousX，previousY，currentX，currentY）；
填充（255）；
冲程（0）；
冲程重量（1）；
椭圆（x，y，半径，半径）；
}
void keyPressed（）//移动===========================================================
{
如果（键==编码）{
如果（键代码==向下）{
方向x=0；
方向y=1；
}
else if（keyCode==UP）{
方向x=0；
方向y=-1；
}
else if（keyCode==左）{
方向x=-1；
方向y=0；
}
else if（keyCode==右）{
方向x=1；
方向y=0；
}
}
}

希望这可能是有用的，如果你有更多的问题，请联系或添加意见，顺便说一句，这是一个新的人处理好工作。
向何塞致敬。
我认为这里的诀窍是一直画线（只要有一个盒子可以画线），当球进入一个新的盒子时改变端点。正如你所说，你就快到了，只需要做一些调整就可以了。下面是一些伪代码，我将如何处理这个问题：

void draw() {
  draw background

  if (previous and current coords are different) {
    draw line from previous coords to current coords
  }

  if (ball is within a box) {
    draw the box highlighted
    if (current coords are not the center of the box) {
      set previous coords to current coords
      set current coords to center of the box
    }
  }
  else {
    draw the box normally
  }

  do the same for remaining boxes
}

你能写一个清晰的标题吗？这个标题没有说明你的问题。