multiple images using arrays.

bangbang

Hello I'm making simple maze game with adding character and creatures.

For the background, I'm using arrays (you can see the arrays under the coding lines)

How can I add multiple images by using arrays that I created.

I attahced images too.

Here is my coding lines.

PImage brick;
PImage wall;
//PImage user;
int GRID_TILE_WIDTH =48;
int GRID_TILE_HEIGHT = GRID_TILE_WIDTH;
int [][] worldGrid = { 
  {1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1}


};
boolean pUp,pDown,pLeft,pRight=false;
int pCol=4, pRow=1;
PImage spriteSheet;
PImage mySprite[];
int direction=0;
  void setup() {
    noSmooth();
    size (GRID_TILE_WIDTH*20, GRID_TILE_WIDTH*20);
    println("worldGrid length="+worldGrid.length);
    brick = loadImage("brick.jpg");
    wall = loadImage("wall.png");
    //user = loadImage("user.jpg");
    spriteSheet = loadImage("sprite.png");
    mySprite = new PImage[4];
    for (int y = 0; y < 4; y++){
        mySprite[y] = spriteSheet.get(0, y*24, 24, 24);
    }
  }

  void draw() {
    background(100);
    worldDrawGrid();
    handleKeyStates();
    image(mySprite[direction], pCol*GRID_TILE_WIDTH, pRow*GRID_TILE_WIDTH, GRID_TILE_WIDTH, GRID_TILE_WIDTH);
  }

void worldDrawGrid() {
  noStroke();
  for (int row=0; row<worldGrid.length; row++) {
    for ( int col=0; col<worldGrid[row].length; col++) {
      if (worldGrid[row][col]==2) {
        image(wall, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);
        //image(user, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);
        } else {
        image(brick, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);

      }
    }
  }
}
void keyReleased() {
  switch (keyCode) {
  case DOWN:  
    pDown=true; 
    direction=0;
    break;
  case UP:    
    pUp=true; 
    direction=1;
    break;
  case LEFT:  
    pLeft=true;
    direction=2; 
    break;
  case RIGHT: 
    pRight=true; 
    direction=3;
    break;
  }
}
void handleKeyStates(){
  if(pDown && worldGrid[pRow+1][pCol]==0){
   pRow++; 
  } else if (pUp && worldGrid[pRow-1][pCol]==0){
   pRow--; 
  } else if (pLeft  && worldGrid[pRow][pCol-1]==0){
   pCol--; 
  } else if (pRight && worldGrid[pRow][pCol+1]==0){
   pCol++; 
  }
  pUp = pDown = pLeft = pRight = false;
}

JÞ1

In your array you have 0s and 1s. but in worldDrawGrid() you only draw edge pieces if the position in the array is equal to two.

PImage brick;
PImage wall;
//PImage user;
int GRID_TILE_WIDTH =48;
int GRID_TILE_HEIGHT = GRID_TILE_WIDTH;
int [][] worldGrid = { 
  {1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
  {1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1}


};
boolean pUp,pDown,pLeft,pRight=false;
int pCol=4, pRow=1;
PImage spriteSheet;
PImage mySprite[];
int direction=0;
  void setup() {
    noSmooth();
    size (GRID_TILE_WIDTH*20, GRID_TILE_WIDTH*20);
    println("worldGrid length="+worldGrid.length);
    brick = loadImage("brick.jpg");
    wall = loadImage("wall.png");
    //user = loadImage("user.jpg");
    spriteSheet = loadImage("sprite.png");
    mySprite = new PImage[4];
    for (int y = 0; y < 4; y++){
        mySprite[y] = spriteSheet.get(0, y*24, 24, 24);
    }
  }

  void draw() {
    background(100);
    worldDrawGrid();
    handleKeyStates();
    image(mySprite[direction], pCol*GRID_TILE_WIDTH, pRow*GRID_TILE_WIDTH, GRID_TILE_WIDTH, GRID_TILE_WIDTH);
  }

void worldDrawGrid() {
  noStroke();
  for (int row=0; row<worldGrid.length; row++) {
    for ( int col=0; col<worldGrid[row].length; col++) {
      if (worldGrid[row][col]==1) { //CHANGED THIS FROM 2 TO 1
        image(wall, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);
        //image(user, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);
        } else {
        image(brick, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);

      }
    }
  }
}
void keyReleased() {
  switch (keyCode) {
  case DOWN:  
    pDown=true; 
    direction=0;
    break;
  case UP:    
    pUp=true; 
    direction=1;
    break;
  case LEFT:  
    pLeft=true;
    direction=2; 
    break;
  case RIGHT: 
    pRight=true; 
    direction=3;
    break;
  }
}
void handleKeyStates(){
  if(pDown && worldGrid[pRow+1][pCol]==0){
   pRow++; 
  } else if (pUp && worldGrid[pRow-1][pCol]==0){
   pRow--; 
  } else if (pLeft  && worldGrid[pRow][pCol-1]==0){
   pCol--; 
  } else if (pRight && worldGrid[pRow][pCol+1]==0){
   pCol++; 
  }
  pUp = pDown = pLeft = pRight = false;
}

You could also merge brick and wall into one PImage array and rewrite your worldDrawGrid function like this:

void worldDrawGrid() {
      noStroke();
      for (int row=0; row<worldGrid.length; row++) {
        for ( int col=0; col<worldGrid[row].length; col++) {
            image(newArray[worldGrid[row][col]], col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);
            //image(user, col*GRID_TILE_WIDTH, row*GRID_TILE_HEIGHT,GRID_TILE_WIDTH,GRID_TILE_WIDTH);

        }
      }
    }