[Slick2D] Issue with tearing when rendering tiles

Hi all,

I’m having an issue that I believe is a result of a huge inefficiency in my code. I have a 2D array of tiles in my Map class and I try to render them with the method below.

public void render(Graphics g)
	{		
		for(int row = 0; row < tiles.length; row++)
		{
			for(int col = 0; col < tiles[0].length; col++)
			{
				g.drawImage(tiles[row][col].getSprite(), tiles[row][col].getX(), tiles[row][col].getY());
			}
		}
	}

I believe the issue is the fact that I’m rendering a ton of images, but I think I should be using some sort of buffer here. Any suggestions?

Do you mean screen tearing? In that case, try turning on v-sync.

Probably unrelated but still important: you shouldn’t use an image array for tile maps; that is horribly inefficient. You should instead assign an index to every tile, and render the corresponding image. Hopefully this pseudo code will show what I mean:


// For x
   // For y
      if(tileID == 0)
         // Draw grass
      else if(tileID == 1)
         // Draw stone
      // etc.

In my experience this has to do with the precision of your tile positions. Use floats and don’t round.

@wessles, i turned v-sync on, and it worked! i don’t know why i neglected it. thank you very much! yeah my array is actually an array of Tile type, and I pull the tile’s sprite when rendering.

@kudoDEV, i’m not sure if the floats had much of an effect, but I did it. i couldn’t get a noticeable difference like i did when i turned v-sync on. thanks for the suggestion though!

the game still doesn’t look very smooth, but i guess i’ll have to look into it more. thanks again for your suggestions. ;D