Sprite tearing and bleeding on sprite sheet (Automated fix for this issue?)
So I've been having this issue for a while involving the sprite sheets on a 2D game I'm developing. Sometimes, and it often depends on my camera's position, I'll get small little lines between sprites.
After doing a fair amount of research, I learned that it's due to texture bleeding where adjacent sprites on a sprite sheet leak into the edges of one another. As of now, the tiles in my sprite sheet (really a tile sheet but they're kinda the same thing so whatever) are all adjacent to each other with no sort of padding between them. However, I've come to the conclusion that padding alone will not be the only thing I'd have to do since there would still be lines and gaps between sprites (albeit just transparent lines and not textures bleeding in from other tiles), so I'd have to make some sort of bleed zone (repeating the border pixels around each sprite) in the padding in order to remove the issue with these gaps altogether. However, adding padding between sprites, along with making a bleed zone manually is sort of a pain in the ass. Basically, the question I am asking is if there is a software out there that can automate this process? If I can avoid doing this manually, that'd really be nice since I have a lot of tiles I'd have to do this to. I hope I made sense, and if I need to clarify anything and/or be more specific, I'll be happy to. Thanks in advance!
Answer by HenriqueSabino · Dec 01, 2017 at 11:20 PM
I've had this problem, too. I've fixed redoing the spritesheet with 2px of margin, for example if you sprite is 8x8, you resize it to 12x12 and cut it on the sprite editor. Hint: use the Slice type "Grid by cell size" and put this way: pixel size: (your resolution without margin, 8x8 in the example) Offset: x: 2 y: 2 Padding: x: 4 y: 4.
Oh, well I know how to technically fix the issue with adding spacing between the individual sprites, I was just wondering if there was perhaps a program that would automate this process since doing it manually would take a long time.
Well, since it's a pixel art, you can you the site/program Piskel. This will help you with resizing the spritesheets. It's just do the following:
import your spritesheet in the "import" tab
select browse images
mark "import as spritesheet"
List item
set the frame size with your current size (8x8 for instance)
click on replace
Go to the resize tab
set the anchor to the middle
set the new resolution (12x12 for instance) and click on resize and you're done!
Just tried it earlier today. Thank you so much! I still had to add the bleed zone manually but that was relatively easy.
Thank you very much :) I was struggling with this math for a while
Answer by KayvonX · Jul 13, 2018 at 01:31 AM
@adscomics I hit the same problem, but found the solution. It's caused by the sprite filtering. Go to your spliced sprite and change Filter Mode to Point (no filter).