Batch Image import from data folder for frameRate animation

johnnyUtah05

Hi, I have a robust amount of still images in my data folder that I would like to loop through to import. Hi I am trying to implement the string formatting: nf() method to batch import images to create a frame rate animation. I see Casey Reas' code that states to use the command; however, i am a bit confused.

My file directory is, "dream_fd4251e2c7 (1).jpg" and I think that if I use "dream_fd4251e2c7 " + nf(i, 4) + ".jpg" it should work? But it doesn't seems to.

Furthermore, he states that 'if I know the number of frames' I can loop through and add the directory name; however, I feel like I can use an arrayList for this functionality?

Below is the monotonous code.

I wish to instantiate an arrayList at the beginning, then loop through the directory with a for loop adding a new file each frame. Does this make sense? thank you in advance.

int numFrames = 33;  // The number of frames in the animation
int frame = 0;
PImage[] images = new PImage[numFrames];

void setup()
{
  size(800,450);
  frameRate(20);

  images[0]  = loadImage("dream_fd4251e2c7 (1).jpg");
  images[1]  = loadImage("dream_fd4251e2c7 (2).jpg"); 
  images[2]  = loadImage("dream_fd4251e2c7 (3).jpg");
  images[3]  = loadImage("dream_fd4251e2c7 (3).jpg");
  images[4]  = loadImage("dream_fd4251e2c7 (4).jpg");
  images[5]  = loadImage("dream_fd4251e2c7 (5).jpg");
  images[6]  = loadImage("dream_fd4251e2c7 (6).jpg");
  images[7]  = loadImage("dream_fd4251e2c7 (7).jpg");
  images[8]  = loadImage("dream_fd4251e2c7 (8).jpg");
  images[9]  = loadImage("dream_fd4251e2c7 (9).jpg");
  images[10]  = loadImage("dream_fd4251e2c7 (10).jpg");
  images[11]  = loadImage("dream_fd4251e2c7 (11).jpg");
  images[12]  = loadImage("dream_fd4251e2c7 (12).jpg");
  images[13]  = loadImage("dream_fd4251e2c7 (13).jpg");
  images[14]  = loadImage("dream_fd4251e2c7 (14).jpg");
  images[15]  = loadImage("dream_fd4251e2c7 (15).jpg");
  images[16]  = loadImage("dream_fd4251e2c7 (16).jpg");
  images[17]  = loadImage("dream_fd4251e2c7 (17).jpg");
  images[18]  = loadImage("dream_fd4251e2c7 (18).jpg");
  images[19]  = loadImage("dream_fd4251e2c7 (19).jpg");
  images[20]  = loadImage("dream_fd4251e2c7 (20).jpg");
  images[21]  = loadImage("dream_fd4251e2c7 (21).jpg");
  images[22]  = loadImage("dream_fd4251e2c7 (22).jpg");
  images[23]  = loadImage("dream_fd4251e2c7 (23).jpg");
  images[24]  = loadImage("dream_fd4251e2c7 (24).jpg");
  images[25]  = loadImage("dream_fd4251e2c7 (25).jpg");
  images[26]  = loadImage("dream_fd4251e2c7 (26).jpg");
  images[27]  = loadImage("dream_fd4251e2c7 (27).jpg");
  images[28]  = loadImage("dream_fd4251e2c7 (28).jpg");
  images[29]  = loadImage("dream_fd4251e2c7 (29).jpg");
  images[30]  = loadImage("dream_fd4251e2c7 (30).jpg");
  images[31]  = loadImage("dream_fd4251e2c7 (31).jpg");
  images[32]  = loadImage("dream_fd4251e2c7 (32).jpg");

  // If you don't want to load each image separately
  // and you know how many frames you have, you
  // can create the filenames as the program runs.
  // The nf() command does number formatting, which will
  // ensure that the number is (in this case) 4 digits.
  //for(int i=0; i<numFrames; i++) {
  //  String imageName = "PT_anim" + nf(i, 4) + ".gif";
  //  images[i] = loadImage(imageName);
  //}
} 

void draw() 
{ 
  frame = (frame+1)%numFrames;  // Use % to cycle through frames
  image(images[frame], 0, 0);
}

KevinWorkman

Please be more specific than saying it doesn't work. What exactly is the nf() function returning each index?

But anyway, can't you just use a plain old for loop?

for(int i = 0; i < images.length; i++){
   int imageNumber = i+1;
   images[i]  = loadImage("dream_fd4251e2c7 (" + imageNumber + ").jpg");
}

Which can be shortened to:

for(int i = 0; i < images.length; i++){
   images[i]  = loadImage("dream_fd4251e2c7 (" + (i+1) + ").jpg");
}

Also note that you're using an array, not an ArrayList.

johnnyUtah05

Thank you for your reply. I agree that there is not any reason to use the nf() command. Now I am getting an error in the void draw() loop where:

frame = (frame + 1) % numFrames;
image(images[frame], 0, 0);

Is yielding errors that the _'the operator + is undefined for the argument type(s) Frame, int. Type mismatch 'java.awt.Frame' does noot match with 'int' _on the respective lines of code.

int numFrames = 54;
PImage[] images = new PImage[numFrames];

void setup() {
  size(800, 450);
  frameRate(20);

  for (int i = 0; i < images.length; i++) {
    images[i] = loadImage("dream_fd4251e2c7 (" + (i+1) + ").jpg");
  }
}

void draw() { 
  frame = (frame+1)%numFrames;  // Use % to cycle through frames
  image(images[frame], 0, 0);
}

I merely wished to see if using an arrayLoop or some kind of method to count what exists in the 'data' folder would be possible. Thank you again.

johnnyUtah05

nvmd. I restarted and now it works like a charm.

GoToLoop

... or some kind of method to count what exists in the 'data' folder would be possible.

https://forum.Processing.org/two/discussion/17111/how-to-display-a-random-image-using-processing#Item_3

KevinWorkman

The code you posted doesn't make a ton of sense. What is the frame variable? Note that Processing already has a frame variable, so you probably shouldn't name a variable frame.

Also note that Processing has a frameCount variable, which might already do what you're trying to do with your frame variable. The reference is your best friend: https://processing.org/reference/

johnnyUtah05

@KevinWorkman, the code I posted was written by James Patterson and is posted here: http://processingjs.org/learning/topic/sequential/. It is in the learning section. Thanks for your comment.

koogs

Your line 8 is using images.length as the limit for the number of frames

for (int i = 0; i < images.length; i++)

You can use the same value here instead of numFrames

frame = (frame + 1) % numFrames;

That way you don't have to hard code a value for numFrames. In fact you can probably remove it.

Dynamically loading all the images in a directory is a frequent topic here, search the forum for it. You'll need a filename filter and an array list rather than an array. You may also have problems because of your naming scheme. I'd go with (your_prefix)_0000.jpg etc rather than a variable width number, spaces and brackets in the filename. You'll need to use nf.

If you are using processing JavaScript mode then it's a good idea to mention that in the subject.

jeremydouglass

@KevinWorkman -- if there are now problems of style (e.g. shadowing frame, not using frameCount) in Patterson's processingjs.org Sequential Tutorial or his processing.org Sequential Tutorial, would it be worth sending a notice to update?

KevinWorkman

@jeremydougless I dunno, it's up to you.

Note that the Processing version does not use the frame variable, and it's not an issue for the Processing.js version.

Using the frameCount variable isn't strictly necessary, but I'd say you should save yourself work whenever possible.

But most importantly, if the code works, then I'm not going to complain too much.

jeremydouglass

Makes sense. 'If it ain't broke....'