How to adjust code so line of gifs come in one column after another?

pisceanwa..

How to adjust code so line of gifs come in one column after another?

in Contributed Library Questions • 6 months ago

Hi,

I am trying to make it so the vertical line of gifs will appear one column after another next to each other, so far I have put together a code that displays all the gifs, but all of them appear at once. Ideally this is what I have just now, but i am hoping to find a way to make it so each vertical line appears consecutively one after another till the whole screen is like this:

At the moment, my code works by displaying all the columns all at once as such...

This is from my current code:

import gifAnimation.*;

PImage[] animation;

Gif loopingGif;

public void setup() {

size(1680, 1080);

frameRate(100);

background(255);

println("gifAnimation " + Gif.version());

loopingGif = new Gif(this, "giftri2.gif");

loopingGif.loop();

animation = Gif.getPImages(this, "giftri2.gif");

}

void draw() {

for(int i = 0; i<= width; i= i+50){

for(int j = 0; j<= height; j= j+50){

image(loopingGif, i, j);

}

My investigation has figured out how multiply my gifs but I've been really stuck with trying to make it so they appear starting from the left side of the screen until it fills up. Each column is an individual gif.

Is there a way to make the columns appear one after another?

Thank you

Replies(5)

boub_pops..

Re: How to adjust code so line of gifs come in one column after another?

6 months ago

Hi !

The draw() method is what draws one frame. So your code draw every images, every frames.

So if you want to take some time to makes things appear you have to remove the for(i...) loop and control it manually for each Draw().

PhiLho

Re: How to adjust code so line of gifs come in one column after another?

6 months ago

You need a global variable indicating what is the latest displayed column. Every n frames (you probably another counter to count them too), you increment this variable and display another column of Gifs.
Your draw() can be written:

// Better define constants, easier to understand and to adjust globally if needed.
int ROW_NB = 50; // Adjust as needed
int COL_NB = 100; // Idem
int GIF_SIZE = 50;
void draw() {
for(int i = 0; i< COL_NB; i++) {
for(int j = 0; j<= ROW_NB; j++) { image(loopingGif, i * GIF_SIZE, j * GIF_SIZE); }
}
}
}

Then it becomes:

// Same constants as above, plus variables:
int currentCol; // 0 by default
int FRAME_NB = 10; // Add a column every 10 framesvoid draw() {
for(int i = 0; i< currentCol; i++) {
for(int j = 0; j<= ROW_NB; j++) { image(loopingGif, i * GIF_SIZE, j * GIF_SIZE); }
} }
if (frameCount % FRAME_NB == 0) {
currentCol++; // Manage when it reaches max value! ie. COL_NB
}
}

pisceanwa..

Re: How to adjust code so line of gifs come in one column after another?

6 months ago

Edited* It works now! I'm not sure what i did, but after fiddling about with some parts it worked! :) Thank you very much!!!!

import gifAnimation.*;

PImage[] animation;

Gif loopingGif;

Gif nonLoopingGif;

int ROW_NB = 50; // Adjust as needed

int COL_NB = 100;

int GIF_SIZE = 50;

int FRAME_NB = 10;

int currentCol = 0;

public void setup() {

size(800, 800);

frameRate(100);

background(255);

println("gifAnimation " + Gif.version());

// create the GifAnimation object for playback

loopingGif = new Gif(this, "giftri4.gif");

loopingGif.loop();

// create the PImage array for the interactive display

animation = Gif.getPImages(this, "giftri4.gif");

}

void draw() {

for(int i = 0; i< currentCol; i++) {

for(int j = 0; j<= ROW_NB; j++) {

image(loopingGif, i * GIF_SIZE, j * GIF_SIZE); }

}

if (frameCount % FRAME_NB == 0) {

currentCol++;

}

I'm wondering if the gifs stop once they reach the end of the screen? Or is there a set limitation that would need to be placed for this, i know this would be a strain on system memory if it did continue to print the gifs off the screen.

PhiLho

Re: How to adjust code so line of gifs come in one column after another?

6 months ago

NB is a common abbreviation for "number".
Try initializing currentCol at 1, it might start to display something from the start.

PhiLho

Re: How to adjust code so line of gifs come in one column after another?

6 months ago

Mmm, you updated while I answered...
Anyway, you can stop increasing currentCol when it reaches the right end of the sketch area, it might save some CPU...
Or clear the screen and start over, perhaps (ie. just reset the count to 0 or 1).

Top Reply