Help with Images/array

edited November 2015 in Questions about Code

Hi, So we're doing a lab on images and out teacher wants two of our images to show as a grid, two of the grid images I selceted show up as 1 image, while the other one is 21 seperate images. I'm having trouble figuring out how to set up my array for the image grid that only has 1 image. I will put my code below, I'm not very far yet, I think I know how to do the rest after I get the array part figured out.

PImage [] picHero = new PImage[16];
PImage [] picPlanets= new PImage[21];
PImage [] [] picAlien= new PImage[1][16];
PImage [] picKayla= new PImage[15];
PImage [] []picMechanic= new PImage[1][16];
PImage Bg,p0,p1,p2,p3,p4,p5,p6,p7,p8,p9,p10,p11,p12,p13,p14,p15,p16,p17,p18,p19,p20;


void setup() {
  size(512,512);
  PImage Mech =  loadImage("MechanicMale.png");
  for(int i=0; i<picMechanic.length;i++){
   int row = i / 4;
   int col = i % 4;
   int m = i / 1;
   picMechanic[m][i % 1] = Mech.get(col*30, row*25, 30, 25);
  }
 PImage Alien =  loadImage("PterosFemale001.png");
  for(int i=0; i<picAlien.length;i++){
   int row = i / 4;
   int col = i % 4;
   int a = i / 16;
   picAlien[a][i % 16] = Alien.get(col*30, row*25, 30, 25);
  }
 Bg=loadImage("seamless space.PNG");
  picKayla[16] = loadImage("Kayla.png");
  picHero[16] = loadImage("Old hero.png");

  imageMode(CENTER);

}

void draw (){
  background(0);
  noTint();
  image(Bg,width,height,Bg.width/2,Bg.height/2);


}


void keyPressed(){
  if(key== 'a'){

  }

  if(key== CODED){

  }

}

Alien,Kayla,Mechanic,and Hero are the ones that are girds but they are only 1 image in the form of a grid.

Answers

  • Could someone help me please

  • edited November 2015

    What really confuses me about your code is the following two lines:

    PImage [] [] picAlien= new PImage[1][16];
    

    and

    PImage [] []picMechanic= new PImage[1][16];
    

    These look like they're 2D arrays, but they're not, since they've only got one index that really matters. In any case, this shows us that you don't really understand Arrays. So.

    Let's say you need to remember one number. The number is seven. You remember it using an int.

    int the_number = 7;
    

    Great. Now let's say you need to remember two numbers. Seven and Thirty-six.

    int the_first_number = 7;
    int the_second_number = 36;
    

    Great. Now let's say you need to remember 4000 numbers. You could do this:

    int number_1 = 7;
    int number_2 = 36;
    int number_3 = 125;
    //... Oh man, my hand is getting tired!
    int number_4 = 256;
    // ... Forget this. I'm not typing out all these numbers!
    

    No good. Instead, you could remember them as ONE LIST of numbers that is 4000 numbers long. This would be an array of numbers.

    int[] numbers = new int[4000];
    

    That makes space (in the memory of your computer) for the 4000 numbers - but it doesn't give them any meaningful values. You would need to use a loop to do that.

    for(int i=0; i<numbers.length; i++){
      numbers[i] = exp(7-i, i+1); // Gold star if you saw this pattern.
    }
    

    But maybe you don't need a list of numbers. Maybe you several lists of them.

    int[][] times_table = new int[12][12];
    

    This is a 12 by 12 grid of numbers - or (if it helps you to think of it this way) a list of several lists of numbers.

    Of course, I'm using numbers. But you can have Arrays of other things too.

    char[] vowels = { 'a', 'e', 'i', 'o', 'u' }; // Why?
    float[] atomic_weights = new float[120];
    String[] sentences;
    color[][] colors;
    PImage[][] grid_of_images;
    

    Hopefully now you can understand why your "2D" arrays are a little weird. They're a list of lists of images, except there's only one list!

  • Yeah, I've been changing my code a lot since I first posted it, The row by columns array would only work for the planets since there are 17 individuals of them, it's the images that have been confusing me, it's 1 image, but the character in the image is in 16 different positions, I was thinking that I needed an array of 16 so the program can show just one postion, but now I'm thinking that I actually need multiple images to make a grid.

  • This is my new code, The background appears, but the program won't show the planets, I think there's something wrong with my for loop.

    PImage [][] picPlanets= new PImage[3][6];
    
    
    PImage Bg,planets;
    
    
    void setup() {
      size(1034,1024);
    
    
    
    
      for(int i=0; i<3*6;i++){
      PImage planets=  loadImage("planet_"+i+".png");
    
       int row = i / 3;
      int col = i % 3;
      int p = i / 6;
      picPlanets[p][i % 6] = planets.get(col*30, row*25, planets.width, planets.height);
     }
    
     Bg=loadImage("seamless space.PNG");
     // picKayla[0] = loadImage("Kayla.png");
    
    
    
    
    
     //picMechanic[1]=Mech;
     //picAlien[1]=Alien;
    
    
    
      imageMode(CENTER);
    
    }
    
    void draw (){
      background(0);
      noTint();
      image(Bg,width/2,height/2,Bg.width,Bg.height);
    
    
    
    
    
      }
    
    
    
    
    void keyPressed(){
    
    
    
    
    
    
    
    
        if(key== 'p'){
    
            image(planets,width/2,height/2,planets.width,planets.height);
    
    
    
    
     }
    
    }
    
  • _vk_vk
    edited November 2015

    key pressed() as it siblings mousePressed(), keyReleased(), etc, are executed (the code inside them) once when such events happens. So if you draw inside them, and also have some code drawing in draw(), the stuff in draw will overwrite the stuff from keyPressed. Those will be displayed for 1/60th of a second. Instead use a boolean as a flag and do the call to image() in draw based on the state of the boolean.

    like

    //global
    boolean flag = false;
    
    //in draw 
    
    if(flag) image(blah, blah, blah, blah);
    
    // in keyPressed()
    
    if(key = 'p')flag = !flag;
    

    You came up with an algorithm to handle accessing your 2D array (do you really need it? don't know). That's ok. Usually we use a nested loop with 2D arrays, like:

    int[][] arr = new int [2][3]; 
    
    for(int i=0; i<arr.length; i++){
       for(int j=0; j<arr[0].length; j++){
         arr[i][j] = stuff;
        }
    }
    
  • I just used the algorithim that my teacher showed us on an example project.

  • Ok so I got help from my teacher and completed the necessary part of the assignment, but I want to still include the planets, I had made a bouncing project and I tried to incorporate that with the planets, could you help me figure it out, I commented the code I need help on out so you could see the regular program. boolean mech=false; boolean kayla=false; boolean alien=false; boolean planet=false; //int num=10; //float [] x; //float [] y; //float [] dx; //float [] dy; //color [] c; //int boomx=-10; //int boomy=10; PImage [][] picMechanic= new PImage[4][4]; PImage [][] picKayla= new PImage[4][4]; PImage [] picPlanets= new PImage[18]; PImage Bg, p1, Alien, Mech; int a,b;

    void setup() {
      size(1024, 1024);
    
    //x=new float[num];
    // y=new float[num];
    //  dx=new float[num];
    // dy=new float[num];
    //    c = new color[num];
    // for(int i=0; i<x.length;i++){
    //   x[i]=(random(width));
    //   y[i]=(random(height));
    //   dx[i]=(random(boomx,boomy));
    //   dy[i]=(random(boomx,boomy));
     //}
    for(int p=0;p<picPlanets.length;p++){
      PImage planets=loadImage("planet_"+p+".png");
    picPlanets[p]=planets;
    }
      PImage Mech=  loadImage("MechanicMale.png");
      for (int i=0; i<4*4; i++) {
    
    
        int row = i / 4;
        int col = i % 4;
    
        picMechanic[row][col] = Mech.get(col*64, row*64, 64, 64);
      }
      PImage Kayla=  loadImage("Kayla.png");
      for (int i=0; i<4*4; i++) {
    
    
        int row = i / 4;
        int col = i % 4;
    
        picKayla[row][col] = Kayla.get(col*64, row*64, 64, 64);
      }
      Bg=loadImage("seamless space.PNG");
    
      p1=loadImage("planet_1.png");
      Alien=loadImage("PterosFemale001.png");
      imageMode(CENTER);
    
    }
    
    void draw () {
      background(0);
      noTint();
      image(Bg, width/2, height/2, Bg.width, Bg.height);
    
      if (mech) {
        int i= millis()/100%16;
        int row=i/4;
        int col = i%4;
        image(picMechanic[row][col], width/2, height/2, 64, 64);
      }
    
        image(picKayla[a][b], width/3, height/3, 64, 64);
    
    
      if (alien) {
        image(Alien, width/2, height/2, 64, height);
     //if(planet){
    //for(int i=0; i<x.length;i++){
      // x[i]+=dx[i];
     //  y[i]+=dy[i];
       // fill(c[i]); 
      //  image(picPlanets[i],x[i],y[i],width/4,height/4);
     // if((x[i]>width-10) || (x[i]<10)){
     // dx[i]=-dx[i];
    //}
    //if((y[i]>width-10) || (y[i]<10)){
     // dy[i]=-dy[i];
    //}
    //}
    //}
     // }
    //}
    
    
    
    
    void keyPressed() {
    
    
      if(key==CODED){
        if(keyCode==UP){
           a=int(random(0,4));
           b=int(random(0,4));
        }
      if(keyCode==DOWN){
         a=0;
         b=1;
      }
    }
    
    //if(key=='p'){
    //  planet=!planet;
    //}
      if (key=='a'){
    
        alien=!alien;
      }
    
    
      if (key== 'm') {
    
        mech=!mech;
      }
    }
    
Sign In or Register to comment.