Mover varias imagenes

Buen día, soy algo nuevo en processing; y pues la verdad estoy tratando de poner varias imagenes en una misma ventana. Es posible que con una sola variable de PImage, pueda colocarlas en diferentes espacios de la ventana?

PImage image1;
boolean isLoaded = false;
void setup()
{
    size(600, 700);
  background(0);
}
void keyPressed(){
  if(key=='q'){
    image1=loadImage("rojo.jpg");
    isLoaded=true;
  }
  if(key=='w'){
    image1=loadImage("índice.png");
    isLoaded=true;
  }
}
void draw()
{
    background(255);
    if(isLoaded)image(image1, 50, 50, 200, 200); 
}

Como se puede observar estoy tratando de que al pulsar cierta tecla me aparezca una imagen diferente, pero quiero que cuando pulse cada una, aparezca de manera ordenada. En draw sé que puedo colocar las coordenadas, pero al ser varias imagenes en distintos lados de la ventana, ¿Cómo puedo hacer para que las coordenadas varíen sin que varíe la variable?

De antemano muchas gracias y cualquier comentario o sugerencia es de gran ayuda.
:slight_smile:

1 Like

Hello Pandther
I don’t speak Spanish and just translated your question, so I hope I got everything right. If I got It correctly you want to use a PImage Variable multiple times but with different X- and Y-coordinates. Generally speaking you can use a PImage variable multiple times by simply using the method image(PImage, X-cord, Y-cord); multiple times. But you need to ask yourself where your different X- and Y-coordinates should come from. Do you want a Program where the coordinates of your image depend a mouse-input, a keyboard-input, or should it simply be hard coded into your program?

I need recycle the code, bc my code is too long:

PImage image1, image2, image3, image4, image5, image6;

boolean isLoaded = false;
boolean isLoad=false;
boolean isLoade =false;
boolean isLoaded1 =false;
boolean isLoaded2 =false;
boolean isLoaded3 =false;
void setup()
{
    size(600, 700);
  background(0);

}
void keyPressed(){
  if(key=='q'){
    image1=loadImage("rojo.jpg");
    isLoaded=true;
  }
  else if(key=='w'){
    image2=loadImage("índice.png");
    isLoad=true;
  }
  else if(key=='e'){
    image3=loadImage("Sin título.png");
    isLoade=true;
  }
  else if(key=='r'){
    image4=loadImage("Sin título2.png");
    isLoaded1=true;
  }
  else if(key=='t'){
    image5=loadImage("Sin título3.png");
    isLoaded2=true;
  }
  else if(key=='y'){
    image6=loadImage("Sin título4.png");
    isLoaded3=true;
  }
}

void draw()
{
    if(isLoaded){
      image(image1, 50, 50, 180, 180);
    }
    if(isLoad){
      image(image2, 350, 50, 180, 180);
    }
    if(isLoade){
      image(image3, 50, 280, 180, 180);
    }
    if(isLoaded1){
      image(image4, 350, 280, 180, 180);
    }
    if(isLoaded2){
      image(image5, 50, 500, 180, 180);
    }
    if(isLoaded3){
      image(image6, 350, 500, 180, 180);
    }
}

I guess that I could use only one boolean variable, and only one PImage variable, but I don’t know how to make that. When I use only one PImage (image1) with diferent variables (indice, sin título, sin título1, etc). Draw only is showing one image for KeyPressed. I want to appear all the images in the window.

Thx for the support.

1 Like

You could improve the length of your sketch by completely deleting the void draw() section of your code (still write void draw(){} but with nothing inside it) and only using void setup() and void keyPressed(). Then you put all loadImage(); statements into the void setup section of the code and for every individual letter inside keyPressed you add an image(); statement, which prints the corresponding image to your canvas.

1 Like

¿Sabes cómo usar class? ¿Puedes usar clases para resolver esto? Combinar cada x, y con un PImages y ponerlos en una lista (como ArrayList o ArrayList) podría ser lo mejor solución.