How can I stitch many small images into one large image?

I'm making a game. This is a 2D game and the map is drawn in a double loop:

for(int i = 0; i < mapArray.length; i++){
   for(int j = 0; j < mapArray[1].length; j++){
     //if statement for if its on the screen
     g.drawImage(tiles.get(mapArray[i][j]).getImage(), j * textureSize, i * textureSize, null);

   }
}

      

These are 32x32 images and I was wondering how to stitch them all together to create one big image in the beginning would be more efficient in drawing. The resulting image will only be around 1500x1500.

I was thinking about making it stitched into one image (especially since I plan on making fewer images, which would make the loop even longer.) So that it didn't have to run a double for loop (it shoots 60 FPS). But I don't know how to do this, and would it really improve performance if I did?

Alternatively, I could just insert them into lines and only display the lines that are on the screen (to remove the large image issue). So it will still be much less intense than the crazy cycle I have right now.

Edit: One last thing, if you can provide an example on how to do this without additional libraries that would be optimal.

I currently have this stitching code:

Edit: works now. Leaving it here for future readers:

 public void stitchImages(){

    BufferedImage temp = new BufferedImage( <Width> , <height> , BufferedImage.TYPE_INT_RGB);
    Graphics2D g = (Graphics2D) temp.getGraphics();

    for (int b = 0; b < mapArray.length; b++) {
        for (int a = 0; a < mapArray[b].length; a++) {


                g.drawImage(tiles.get(mapArray[b][a]).getImage(),
                        (int) mapX + a * textureSize, (int) mapY + b
                                * textureSize, null);



        }
    }


    mapImage = temp;


}

      

+3


source to share


1 answer


Create a new image to encapsulate all of your images. Paint your images on load and then just paint this in paintComponent ()

BufferedImage im = new BufferedImage(1500,1500,BufferedImage.TYPE_INT_RGB);

private void init() {

    Graphics g = im.getGraphics();

    for(int i = 0; i < mapArray.length; i++){
       for(int j = 0; j < mapArray[1].length; j++){
         //if statement for if its on the screen
         g.drawImage(tiles.get(mapArray[i][j]).getImage(), j * textureSize, i * textureSize, null);

       }
    }
}

public void paintCompoent(Graphics g) {
  super.paintComponent(g);
  g.drawImage(im,0,0,null);
}

      



EDIT:

As for your idea to just color the lines that are on the screen, you can do that by making Image

the window size and just drawing on it. But in general, it's not a big deal for drawing a large image (as long as the image fits into memory and you don't get an OutOfMemoryException) as your GPU capabilities are smoking your cpu

+1


source







All Articles