Bug: Outline around un-antialiased sprites
by Christopher Adams · in Torque X 2D · 05/15/2007 (10:14 am) · 6 replies
Let's say I have create a PNG sprite with transparent background, and there is NO antialiasing on my sprite by choice. Upon loading this sprite in the editor, there is a faint whitish-gray outline around it. This result is undesired.
1. Is there a way to prevent this behaviour via code?
2. Is there a PNG creation method I'm missing, which will prevent this from happening? I want to create un-antialiased sprites and have them draw without blending the sprite boarder with the alpha. Do note, that certain colors cause this behaviour to become more apparent due to the blending of the main sprite with the alpha channel.
I have searched the TorqueX forums and have only come across the following related threads which have not answered this quesion:
pngcrush nor SuperPNG fixes the alpha halo:
http://www.garagegames.com/mg/forums/result.thread.php?qt=19049
This talks about a halo around the boarder, which is similar in nature, but even if my sprite doesn't touch the boarder I am seeing a halo:
http://www.garagegames.com/mg/forums/result.thread.php?qt=56383)http://www.garagegames.com/mg/forums/result.thread.php?qt=56383
Thanks for any insight.
-csa
1. Is there a way to prevent this behaviour via code?
2. Is there a PNG creation method I'm missing, which will prevent this from happening? I want to create un-antialiased sprites and have them draw without blending the sprite boarder with the alpha. Do note, that certain colors cause this behaviour to become more apparent due to the blending of the main sprite with the alpha channel.
I have searched the TorqueX forums and have only come across the following related threads which have not answered this quesion:
pngcrush nor SuperPNG fixes the alpha halo:
http://www.garagegames.com/mg/forums/result.thread.php?qt=19049
This talks about a halo around the boarder, which is similar in nature, but even if my sprite doesn't touch the boarder I am seeing a halo:
http://www.garagegames.com/mg/forums/result.thread.php?qt=56383)http://www.garagegames.com/mg/forums/result.thread.php?qt=56383
Thanks for any insight.
-csa
#2
12/02/2007 (7:30 pm)
So has anyone figured out how to do this yet? Anyone? I would like to do the same thing and have been unable to find any posts that would help me out with this.
#3
To fix the problem try to follow these steps:
1) First download the latest version of GIMP at http://www.gimp.org/, so you don't have to do with SuperPNG. Open your image with GIMP (I suppose your image doesn't have an alpha channel).
2) Suppose your background is colored with magenta (the outline problem appears for every type of color), select the magenta color, then go to "Levels" an create a mask (NOT an alpha channel, a mask gives better results). Checks the "Selection" radio button and the "Invert mask" checkbox. In this way, the magenta background should be replaced byt the classic white and grey checkboard. Go back to "Levels" and apply the created mask.
3) Save your file as PNG. GIMP should ask you to select some options. REMEMBER to UNCHECK the "Save background color" and "Save transparent color informations" checkboxes (you can uncheck all boxes to be sure too, try to experiment).
Import your image in Torque X Builder. Now the "halo" around your sprite should be disappeared.
However, if your sprite touches the image's border, a line should be appear on the border itself. I tried to fix these problem, but the only solution is to maintain a gap of 1 pixel at least all around your sprite. In this way, and using the save method I've explained, your sprite sheets should work perfectly with Torque X Builder.
Now I have a problem, perhaps related to the same issue. If a import a tiled image (to create a tilemap), when I subdivide it with "CELL" mode, a line of every tile appears in the other (in general tiling doesn't work properly). To create my tiled image I have followed this roadmap:
1) Tiles are squared.
2) The size of every tile is a power of two (16x16 I tried).
3) Number of tiles along X and Y are a power of two too (8x4 I tried).
4) I saved the PNG image with the method above.
My question is: if tiling doesn't work properly, is a bug of the Torque X Engine, of the Torque X Builder, or the PNG tiled image is wrong? If tiling doesn't work, the only way to create a tilemap is to import every tile as individual material, but this is expensive. Someone can help me? Thank you in advance.
01/03/2008 (3:25 am)
Hy Christopher,To fix the problem try to follow these steps:
1) First download the latest version of GIMP at http://www.gimp.org/, so you don't have to do with SuperPNG. Open your image with GIMP (I suppose your image doesn't have an alpha channel).
2) Suppose your background is colored with magenta (the outline problem appears for every type of color), select the magenta color, then go to "Levels" an create a mask (NOT an alpha channel, a mask gives better results). Checks the "Selection" radio button and the "Invert mask" checkbox. In this way, the magenta background should be replaced byt the classic white and grey checkboard. Go back to "Levels" and apply the created mask.
3) Save your file as PNG. GIMP should ask you to select some options. REMEMBER to UNCHECK the "Save background color" and "Save transparent color informations" checkboxes (you can uncheck all boxes to be sure too, try to experiment).
Import your image in Torque X Builder. Now the "halo" around your sprite should be disappeared.
However, if your sprite touches the image's border, a line should be appear on the border itself. I tried to fix these problem, but the only solution is to maintain a gap of 1 pixel at least all around your sprite. In this way, and using the save method I've explained, your sprite sheets should work perfectly with Torque X Builder.
Now I have a problem, perhaps related to the same issue. If a import a tiled image (to create a tilemap), when I subdivide it with "CELL" mode, a line of every tile appears in the other (in general tiling doesn't work properly). To create my tiled image I have followed this roadmap:
1) Tiles are squared.
2) The size of every tile is a power of two (16x16 I tried).
3) Number of tiles along X and Y are a power of two too (8x4 I tried).
4) I saved the PNG image with the method above.
My question is: if tiling doesn't work properly, is a bug of the Torque X Engine, of the Torque X Builder, or the PNG tiled image is wrong? If tiling doesn't work, the only way to create a tilemap is to import every tile as individual material, but this is expensive. Someone can help me? Thank you in advance.
#4
Therefore, I suspect that it is really a bug that they didn't have the time to fix. If you don't want the lines, you will have to create a separate png for each and every one of your tiles.
07/10/2009 (7:46 am)
Max, about this line that appears on your tilemaps: if you look at the Platformer Starter Kit for TX, you will notice that they used the workaround you described.Therefore, I suspect that it is really a bug that they didn't have the time to fix. If you don't want the lines, you will have to create a separate png for each and every one of your tiles.
#5
I see that too, but it's just a glitch in the editor and so far hasn't affected any game. Let me know if you are seeing it in game, though.
07/12/2009 (9:12 pm)
Are you seeing the border in the game itself or just in TXB? I think the game builder is still based on TGB, not a complete rewrite in XNA (the XNA version doesn't have a rich enough GUI system for that).I see that too, but it's just a glitch in the editor and so far hasn't affected any game. Let me know if you are seeing it in game, though.
#6
I found creating art with a black background will eliminate the halo as well(at least for my game :) )
07/14/2009 (6:31 am)
I've noticed the line bug as well. Though I found that it only shows up in the builder and not in game.I found creating art with a black background will eliminate the halo as well(at least for my game :) )
Torque Owner Christopher Adams
http://www.garagegames.com/mg/forums/result.thread.php?qt=46105
Anyone have any ideas how I do this same sort of thing for TGBX?
Thanks!
-csa