Image Slideshow based on folder + QR code triggers /Performance

Processing Project Guidance
1

Hello,

I’m a starter and i’m very happy where i got with my code, it does work, but the performance is not optimal, the fps drops significantly, and it makes the fade not nice.

And i don’t see how i can ‘simplify’ or make the code more clean.
Im looking for advice and help.

Below you can find my current code, and on the following link a few 4k simpel color test images.
Test images

Project details ::
-output is 4K (3840*2160 Pixels)
-Images are also exact 4K but in portrait mode.
-Images are found in a local dropbox folder. (need to check regularly for updates in the folder)
-Pictures are randomly chosen and displayed for x amount of time.
-Whenever there is a QRcode scan (performed as keyboard input + ENTER) the next slide will be the one scanned.(QRcode contains the filename + file extension)

import java.util.Date;
PFont font;
String folder = "C:/Dropbox/Inzendingen/Uitzending/";
String startImage = "C:/Dropbox/Inzendingen/Uitzending/Blauw.jpg";
String rndImage = ""; //string for storing path+filename to random image
PImage img; //image 
int fade = 255;
color cBg = color(0); //Background color

String[] filenames;
int timerFile = 100000; //milliseconde interval of checking for new files
int timer2 = 0; 
boolean goFile = false;


int timerSlide = 10000; //miliseconde interval of the slideshow
int timer1 =0;
boolean goSlide= false;

boolean goPod = false; //Picture on demand by scanning QR code
String Pod ="";

 




void setup(){ //////////////////////////////////////////////////////////////////////////
  fullScreen(2);
      File te = new File(startImage);
      if (te.exists()){
        img = loadImage(startImage);
       }
  filenames = listFileNames(folder);
  
  //printArray(filenames);
  timer1 = millis();
  timer2 = millis();
  
  noSmooth(); //Everything is pixel accurate
  font = createFont("Arial Bold",48); //FPS display
  }

void draw(){ ///////////////////////////////////////////////////////////////////////////
  rotate(radians(-90));
  translate(-2160,0);
  
  //Go slideshow---------------
  if ((millis() - timer1)>= timerSlide){
  //print("Go Slideshow ::" + (millis() - timer1));
  timer1 = millis();
  goSlide =true; 
  }
  
  if (goSlide == true && fade > 0){
  fade -= 10; 
  background(cBg);
  tint(255,fade); 
  image(img,0,0);
  }else if (goSlide == true && fade<= 0 && goPod == false) {
      rndImage = folder + filenames[int(random(filenames.length))];
      File te = new File(rndImage);
      if (te.exists()){
         img = loadImage(rndImage);
       }
  background(cBg);
  image(img , 0,0);
  goSlide = false;
  }else if (goSlide == true && fade<= 0 && goPod == true){
      File te = new File(folder + Pod);
      if ( te.exists()){
        img = loadImage(folder + Pod);
      }
  background(cBg);
  image(img,0,0);
  goSlide = false;
  goPod = false;
  Pod = ""; 
  }else if (goSlide == false && fade < 255 && goPod == false){
  fade += 10; 
  background(cBg);
  tint(255,fade);
  image(img,0,0);
  }
  
  //Go check new files----------
  if ((millis() - timer2)>= timerFile){
  //print("File check ::" + (millis() - timer2));
  timer2 = millis();
  filenames = listFileNames(folder);
  //printArray(filenames);
  }
 
  //Draw FPS-------------------
  //rotate(radians(90));
  //translate(0,160);
  fill(0);
  rect(0,0, 100, 50);
  textFont(font,36);
  fill(125);
  text(int(frameRate),20,30);

}

void keyPressed() { // Scan QRcode - QRcode contains filename+file extension///////////////////////////////////////////////////////
  if (keyCode == ENTER) {
    goPod = true;
     
    }
  else if (keyCode != SHIFT && goPod == false) {
      Pod = Pod + key;
  }
}

String[] listFileNames(String dir) {
  File file = new File(dir);
  if (file.isDirectory()) {
    String names[] = file.list();
    return names;
  } else {
    // If it's not a directory
    return null;
  }
}
2

Hi,

you should activate graphical acceleration with P3D because working with pictures is always demanding.
This way, you will be in a 3D environment with a camera. I have in mind that loading everything at the beginning of your sketch could be good idea, rather thant loading when needing a new image (which is the most consuming action of your sketch), and maybe then move lateraly your camera in the space where all your images will be already displayed.
So you’ll have a longer loading time at the beginning, but then it should be fine.

3

Hey @Pr0tonX

Thanks for pointing me in the good direction.
I didn’t got to the part with the different render modes.
So my solution for now is that I just replaced fullScreen(2) with fullScreen(P2D,2)

Different render mode brought my FPS up again during the transitions between images.

1 Like