Erasing draw after "x" frames

Hi everyone,

I’m a new user of processing and i’m trying to make abstractions drawing with the below code. However I don’t arrive to erase the drawing after a certain amount of frames. Does someone knows how to do this ? Thanks on advance !
(sorry for my English)

static final int NUM_LINES = 1;

float t;

void setup () {
background(0);
size(800, 800);
}

void draw() {
stroke (255);
strokeWeight (0.1);
translate(width/2, height/2);

saveFrame(“output/draw_####”);

for (int i = 0; i < NUM_LINES; i++) {
line (x1(t + i), y1(t + i),x2(t), y2(t + i) );
}
t += 0.1;
}

float x1(float t) {
return sin(t / 10) * 150 + sin(t / 15) * 20;
}

float y1(float t) {
return cos(t / 10) * 200;
}

float x2(float t) {
return sin(t / 5) * 250 + sin(t) * 2;
}

float y2(float t) {
return cos(t / 20) * 250 + cos(t / 6) * 70;
}

You can use

if(frameCount % 60 == 0) {
  background(0);
}

In this code, 60 is the number of frames. If the sketch is running at the default 60 frames per second, each 60 frames will be 1 second.

See % (modulo) and frameCount.

2 Likes

thanks for your answer ! However it is not exactly what I meant.

What I would like is to erase one frame when an other one is created. The idea is to get a fluid movement, a continuous erasure for a continuous creation.

Oh! Just put background(0); inside draw, in the first line, instead of inside setup. This will “erase” the image every frame. Everything inside draw is executed once per frame.

You can also use image(img,0,0) if you don‘t want to erase the whole screen. Just modify the size of the img to what you want saved for the Next Frame with a PGraphics and use get(x,y,w,h) to get the Part of the background that you want to keep.

Badly explained, so here‘s an example :

PGraphics sav;

void setup() {
  size(600,400);
  sav = createGraphics(100,100);
}

void draw() {
  background(0); //resets the whole screen to black
  image(sav, 0, 0); //places the saved image in the top left, like what iPhone does shortly after saving a screenshot (best example i know...)
  ellipse(300,300,50,50);//draw something beautiful you want to keep in the Next frame
sav.beginDraw();
sav.background( get(250,250,350,350)); //saves the image around the ellipse
sav.endDraw();
}