Tile game! Help me increase the performance of Graphics2D.

[santa]

So i decided to start programming in java again after countless hours of Erlang coding. So basically im making a simple game thats going to have tiles. My tile map is going to move and my main character is going to be focused in the center of the screen. Each tile is 40x40 pixels.

My strategy is like this ... I paint a larger picture (80 pixels each side) and when the picture has moved one tile (40 pixels) in some direction I move the picture back and update the objects. This works but you can see the updates (screen is a bit blurry when you hold down the action keys). Im going to have one thread to move the map and update the screen and another to change the mainchars movement.

I'v tried to figure out how double buffering works but I don't know if I implemented it correctly.


This is the code for the graphics and iv removed all unnecessary things like listeners and logic for moving the screen.

 
    @Override
public void paintComponent(Graphics g){
        super.paintComponent(g);

      if (getSize().width <= 0 || getSize().height <= 0)
      return;


    Graphics2D g2 = createOffscreenImage(g);
    paintOnPicture(g2);

    g2.dispose();

    if (offscreen != null && isShowing()) {
      g.drawImage(offscreen, posInImageX, posInImageY, this);
        

      
    }
    
}





    // Creates offscreen image for double buffering
    private Graphics2D createOffscreenImage(Graphics g){
       Graphics2D g2 = null;

       if (offscreen == null || offscreen.getWidth() != imageSizeToBuffer.width
        || offscreen.getHeight() != imageSizeToBuffer.height) {
      offscreen = (BufferedImage) createImage(imageSizeToBuffer.width, imageSizeToBuffer.height);
    }
        if (offscreen != null) {
      g2 = offscreen.createGraphics();

    }
       g2.clearRect(0, 0, imageSizeToBuffer.width, imageSizeToBuffer.height);

        return g2;
    }





    // This method is used to do all the painting. Currently is goes through an array and paints the pictures (tiles) that each object has.

    private void paintOnPicture(Graphics2D g2d){
        int x=0,y=0;

        for ( int i = BlockLoctionY; i < (BlockLoctionY + numOfBlocksY);i++){

            for(int ii = BlockLoctionX;ii< (BlockLoctionX + numOfBlocksX);ii++){
                Map.currentMap[i][ii].paintMe(g2d,y*40,x*40); // goes to each object and paints them
                x++;

            }
            x = 0;
            y++;
        }
    }


}

So any ideas how to improve the performance of the graphics? I was thinking to draw a sub image in the screen in staid of moving a bigger picture. But it kind of failed with the drawImage method though its stuck in one side resulting in the image being zoomed and dragged out when i tried to change the position. Thanks for your help guys ! I havent programmed java in ages

[KevinWorkman]

I don't think that's really double buffering. In fact, you're making more work for yourself by drawing to an image, and then immediately drawing that image to the screen. That approach might be valid, but I don't think it counts as double buffering. Are you sure you even need double buffering?

[santa]

If i was to write the image directly to the screen I would see the rendering (for loop adding images) so basically in my code i have the "offscreen" object witch is my BufferedImage to make the drawings on ...and then i create a graphics object (g2) to write stuff to this image in the createOffscreenImage() and then i write stuff on the image in paintOnPucture() and then disposes the g2 graphics object (for memory) and draw the image to the screen. I think this is pretty much the definition of double buffering Double Buffering and Page Flipping (The Java™ Tutorials > Bonus > Full-Screen Exclusive Mode API). My problem is that the image still becomes a bit blurry ...

I'm starting to think that the "if statement" that changes the object and center the image might have something to do with the blur... ex the objects should change and the image be centered if the image has moved 40 pixels in any direction but maybe it moves more than 40 pixels and thereby causing the blur. Or maybe i'm drawing to big picture (size of JPanel + 180 pixels in each direction). Thanks

[KevinWorkman]

If i was to write the image directly to the screen I would see the rendering (for loop adding images)

Are you sure about that? Have you tested that assumption?

[santa]

Im sorry i was wrong you don't see the rendering... but now i don't know how to move the background anymore . =( how can i display half objects and so on.

[KevinWorkman]

I'm not really sure what you mean by half objects. Just drawing off the side of the screen?

[DarrylBurke]

Im sorry i was wrong you don't see the rendering...

Exactly. Swing components are double buffered by default.

That said, your code loses all possible benefits of drawing to an offscreen buffer by doing that drawing in a call originating from paintComponent(...). The correct approach is to do the offscreen drawing whenever a state change requires a GUI update, and calling repaint() when done.

The paintComponent(...) override would then only draw the BufferedImage.

Moving this discussion to Java 2D

db

[santa]

So your saying that i should just draw directly to the screen using drawImage() or when a state change occur use double buffer (before) and then just call repaint() and paint the buffered image? Its really confusing for me, can you explain it so that a idiot would understand it ? =)

[KevinWorkman]

So your saying that i should just draw directly to the screen using drawImage() or when a state change occur use double buffer (before) and then just call repaint() and paint the buffered image? Its really confusing for me, can you explain it so that a idiot would understand it ? =)

To keep it as simple as possible, just draw your items/tiles/whatever directly to the screen. Get that working first.

If you then want to draw to an image for performance reasons or just to see how it works, worry about that later.

[santa]

well I now draw the images without any buffering and its the same (if not worse flickering on the screen when i move the background).

    @Override
public void paintComponent(Graphics g){
        super.paintComponent(g);
Graphics2D g2d = ((Graphics2D) g);

if (getSize().width <= 0 || getSize().height <= 0)
      return;

paintOnPicture(g2d);


    
}

    private void paintOnPicture(Graphics2D g2d){
        paintX = movementX;
        paintY = movementY;
      
      
        for ( int i = 0; i <  numOfBlocksY;i++){
           
            for(int ii = 0;ii<  numOfBlocksX;ii++){
                Map.currentMap[i][ii].paintMe(g2d,paintY,paintX); // Draws an 40x40 image
               paintX += 40;

            }
            paintX = movementX;
            paintY += 40;
           
        }
    }

Any idea what i'm doing wrong? It still feels like i should double buffer guys ! =P

[DarrylBurke]

What does the paintMe(g2d,paintY,paintX) method look like?

db

[santa]

public void paintMe(Graphics2D g2d, int posY, int posX){
    g2d.drawImage(currentBackground.getImg(), posX, posY, mySize.width, mySize.height, null);

}

where mySize.width/height are the measurements of the tile.