[Solved] Sprite batch and zooming - stripes between tiles

[Germanunkol]

I'm sure I've seen this problem described here before, but can't find the answer.

In trAInsported, I now (finally) got around to change the map rendering to use sprite-batches. However, when I scale the map I get these disgusting black stripes between tiles:


I have tried using math.floor() for the coordinates to all love.graphics.translate functions, but no changes so far. Any hints?

[Kadoba]

This problem is called called texture bleeding. It can happen even without using sprite batches. The most common way around this is to pad each tile with a 1px wide border with the same color as the neighboring pixel. You can also render the viewing area to a texture and scale that instead but it has limited use.

[Jasoco]

If you're not doing any scaling when drawing, or are drawing full size to a canvas, then make sure to floor the X and Y of everything you draw. Otherwise do what was mentioned above.

The lines are images being drawn at fractions of a pixel and being blended with the background.

[slime]

viewtopic.php?f=4&t=77022&p=161092#p161090

Tools like TexturePacker and ShoeBox can do the extrusion automatically when they generate a texture atlas from individual images.

[Germanunkol]

Thanks, that worked.

I ended up writing a bash script and using imagemagick, because I don't understand TexturePacker's license and didn't want to buy it, and ShoeBox doesn't run on Linux. For anyone who's interested, the following will pad all files in the current directory and save them into the output/ subdirectory.

Code: Select all

#!/bin/bash

mkdir -p output

for file in *.png
do
convert -size 130x130 xc:none \
	$file -background none -repage +1+1 \
	\( -clone 1 -crop 1x1+1+1 -repage +0+0 \) \
	\( -clone 1 -crop 1x1+128+128 -repage +129+129 \) \
	\( -clone 1 -crop 1x1+1+128 -repage +0+129 \) \
	\( -clone 1 -crop 1x1+128+1 -repage +129+0 \) \
	\( -clone 1 -crop 128x1+1+1 -repage +1+0 \) \
	\( -clone 1 -crop 128x1+1+128 -repage +1+129 \) \
	\( -clone 1 -crop 1x128+1+1 -repage +0+1 \) \
	\( -clone 1 -crop 1x128+128+1 -repage +129+1 \) \
	-flatten \
	-set colorspace RGB output/$file
done

After that, I used Gimp to put the files back together (cause I needed a special order).
Gimp has a nice feature: you can set up a grid by going to "Image->Configure Grid..." and then setting width and height to your tile size. Then enable snap to grid and show the grid (both in the "view" menu). Now you can open all tiles as layers (File->Open as Layers) and simply drag them into their position.