(PLEASE HELP) How to automatically scale the images in a "random Image array" to fit to screen size.

edited November 2017 in Arduino

Hi folks, so I have a sketch in Processing where i'm using a sensor to trigger a random fullscreen image array... the array looks like this:

image(images[(int)random(19)], width/2, height/2);

The trouble is I'm using large high-resolution image files at (2048 x 1536). Which is a bigger res than my screen.

So though it's central and I can adjust the size using the:

width/2, height/2);

The sides of the images are lost off the edge of the screen (Doesn't show the complete image)

So essentially what I'd like to know is how to automatically scale the images to fit to screen?

Like when you have a fit to screen option when setting a desktop for example.

Thanks in advance (PLEASE HELP!)


  • https://processing.org/reference/image_.html

    image(img, a, b, c, d);
    img PImage: the image to display
    a   float: x-coordinate of the image by default
    b   float: y-coordinate of the image by default
    c   float: width to display the image by default
    d   float: height to display the image by default

    the 5-argument version of image() lets you resize.

  • Would you be willing to show me how this...

    image(img, a, b, c, d);

    img PImage: the image to display a float: x-coordinate of the image by default b float: y-coordinate of the image by default c float: width to display the image by default d float: height to display the image by default

    fits into context with this...

    /** * Simple Read * * Read data from the serial port and change the color of a rectangle * when a switch connected to a Wiring or Arduino board is pressed and released. * This example works with the Wiring / Arduino program that follows below. */

    import processing.serial.*; import processing.sound.*;

    // globals PImage [] images; //this sets up the image array and names it 'images' SoundFile file; // initialises the audio Serial myPort; // Creates object from Serial class int val; // Data value received from the serial port long startTime = 0; // Starts at point triggered
    long interval = (30000); // length of time boolean showImages = false; //default state is off boolean prevPlaySound = false; // don't play the sound boolean playSound = false; // don't play the sound

    void setup() { fullScreen(); //size(600,300); // I know that the first port in the serial list on my mac // is always my FTDI adaptor, so I open Serial.list()[0]. // On Windows machines, this generally opens COM1. // Open whatever port is the one you're using. //println (Serial.list()); String portName = Serial.list()[1]; myPort = new Serial(this, portName, 9600);

    images = new PImage [20]; //instantiate the array - this means actually create it setting relevant parameters (like how long the list should be)

    imageMode(CENTER); ///draw images from the middle

    images[0]=loadImage("AG.jpg"); //all this stuff is the image array. you can just drag and drop image files from your desktop to add them to the sketch but you will still need to change the names of the files images[1]=loadImage("BG.jpg"); images[2]=loadImage("CG.jpg"); images[3]=loadImage("DG.jpg"); images[4]=loadImage("EG.jpg"); images[5]=loadImage("FG.jpg"); images[6]=loadImage("GG.jpg"); images[7]=loadImage("HG.jpg"); images[8]=loadImage("IG.jpg"); images[9]=loadImage("JG.jpg"); images[10]=loadImage("KG.jpg"); images[11]=loadImage("LG.jpg"); images[12]=loadImage("MG.jpg"); images[13]=loadImage("NG.jpg"); images[14]=loadImage("OG.jpg"); images[15]=loadImage("PG.jpg"); images[16]=loadImage("QG.jpg"); images[17]=loadImage("RG.jpg"); images[18]=loadImage("SG.jpg"); images[19]=loadImage("TG.jpg"); file = new SoundFile(this, "Installation Music 4.wav"); }

    void draw() { background(0); if ( myPort.available() > 0) { // If data is available, val = myPort.read(); showImages = true; prevPlaySound = playSound; // read it and store it in val println(frameCount, val); startTime = millis(); }

    if (millis() - startTime >= interval) { println("timer finished"); showImages = false; file.stop(); playSound = false; }

    if (showImages == true) { playSound = true; // anything in here will draw only when showimages is true
    if (playSound != prevPlaySound) { file.loop(); } prevPlaySound = playSound; println(prevPlaySound, playSound);

    image(images[(int)random(19)], width/2, height/1.8); frameRate(1); } }

    Because I'm feeling like a blind man in the woods at night right now lol amazed I've come this far.

  • edit post, highlight code and press ctrl-o when posting code...

  • images[3]=loadImage("DG.jpg");

    we don't have have these images...

  • replace your

    image(images[(int)random(19)], width/2, height/1.8);

    with the new version. first three arguments will be the same, the last two should be the required size, probably just width and height

  • Answer ✓

    but beware, that will stretch the image if it's not in the same aspect ratio as the screen.

  • Great thanks for this, just took a while to figure out what you actually meant (working on no sleep) it's all sorted thanks for the assistance!

Sign In or Register to comment.