Overlay video on PNG (w/ transparent bg) => Sequence of PNGs

Hello,
I’m trying to overlay a video (played at a size let’s say 50x50pixels) on top of a PNG with transparent background. My goal is to get a GIF out of it, for which I’d probably need to save a PNG for each frame.

I’ve tried doing that with loadImage and the video library, but the background of the resulting PNG is not transparent. Any ideas on how could I achieve that outcome?

Thank you

If I understand correctly, what you want is to output a PNG file that preserves the original transparency of the image (I guess generating a sequence is not relevant in this particular problem).

To do this I think you need to render it on PGraphics instead of the original window to preserve alpha. This is a starting point:

PGraphics pg;

void setup() {
  size(800,800);
  pg = createGraphics(width, height);
}

void draw() {
  pg.beginDraw();
  pg.clear();
  pg.ellipse(200,200,300,300);
  pg.endDraw();
  image(pg, 0, 0);

  pg.save("image.png");
  noLoop();
}
1 Like