Help with code with images

ArrayList<PImage> images;
int   lastImageIndex = -1;
int   nextImageIndex =  0;
float alphaValue     =  0;
float alphaShift     =  0.004; // adjust speed, smaller = slower
//Parabolic Zoom

void setup() {
  images = new ArrayList<PImage>();
  String[] lines = loadStrings("images.txt");
  for (String line : lines) {
    PImage img = loadImage(line);

void draw() {
  // as index is zero based, zoom in image on index 1,3,5,.. means second, fourth sixth,... image else just blend
  fade(lastImageIndex,nextImageIndex,alphaValue, nextImageIndex % 2 != 0);  
  if (alphaValue >= 1.0) {
    lastImageIndex = nextImageIndex;
    nextImageIndex = (lastImageIndex+1) % images.size();
    alphaValue = 0;
  alphaValue += alphaShift;    

void fade(int l,int n, float a, boolean zi) {    
  if (l >= 0) {
    float invAlpha = 1.0-a;
    tint(255, invAlpha * 255);
    PImage limg=images.get(l);
    // only fade out no zooming
    image(limg, width/2, height/2, width, height); 
    PImage nimg=images.get(n);
    image(nimg, width/2, height/2, width, height);
  tint(255, a * 255);
  PImage nimg=images.get(n);
  // if zi zoom in and blend in else only blend in
  image(nimg, width/2, height/2, zi ? width*a*10 : width, zi ? height*a*10 : height);

Hi, I need help with this code. I am trying to display images. My images are in the data folder and are fed in through a images.txt file. The file looks something like this:

My goal is to have the images fade from DSC01 to the mosaic version and then zoom into the mosaic version and then slowly fade to the DSC03135 and then fade to the mosaic version of that and then fade to the next image or back to the beginning. I want it to be really seamless but I am struggling to get there. please can someone help me with this. I have it so the mosaic is always the second image therefore it will only zoom on every second image.

1 Like

Hi @ajaynischal98,

With the current code and no images I can’t really help you without further information :wink:

What does the mosaic version look like? How much do you want to zoom in? Is there a special effect you want to achieve so it’s seamless?

1 Like


Its just an image made up of tiles of other images. The tiles are about 30x15 and the whole image is in 8k. I want to zoom in so you can see a couple tiles. Not really I just cant get it to fade from image 1 to image 2 and then zoom into the image 2. It basically right now fades in image 1 and then just changes abruptly to image 2 and then just zooms in to image 2. I want it to fade to image 2 and then start zooming in and then fade into image 3 and then fade again into image 4 and then start zooming into image 4. I am not sure how to do that. If you could help me with that it would be amazing!

1 Like

Didn’t you like my version in one of your other threads?