Tip for drawing images at floating coords

BlitzMax Forums/BlitzMax Programming/Tip for drawing images at floating coords

Grey Alien(Posted 2006) [#1]
I found that say you have a square image of 20x20 pixels and it goes right to the edge, if you draw it at floating point coords (say really slowly moving across the screen) you get a nasty kind of flickering effect on the edges. This is because it's anti-aliasing due to the floating point coords them but not properly because the texture isn't big enough. If you boost the texture by one or two pixles all round e.g. 24x24 it's MUCH better (not perfect). This must be because the video card has got some "blank space" to work with at the edges so the anti-aliasing looks much better. Sorry if you already knew this, but it just really improved some moving graphics in my game. Try it :-)


Tachyon(Posted 2006) [#2]
Thanks for the tip, Grey!


Grey Alien(Posted 2006) [#3]
You're welcome. These are the sort of things you just find out as you go along. Be nice if there was a MaxTips website or something.


Damien Sturdy(Posted 2006) [#4]
Pretty sweet, Keep up the good work!

Personally I just use INT when drawing the images. :)


ImaginaryHuman(Posted 2006) [#5]
What you're experiencing here is normal behavior.

When you draw a quad or any other polygon, if you switch on filtering all it does is filter the internal pixels of the polygon. It still considers the edges of the polygon to be whole pixels. It doesn't alphablend the edges with the background. When you position your object at a sub-pixel floating point coordinate, it will try to properly weight the pixel colors to make it look like the object is positioned accurately, but it still wont do anything to make the edge look smooth, especially at a rotation angle.

What you're doing when you add a `border` around the edge of the actual graphic that you want to draw, you're giving it extra allowed space in which to continue filtering. So then there is pixel space in which to apply the filtering process because it's technically within the polygon boundaries.

What you normally would need to do, to allow your graphic to go to the edges and still have a smooth edge, is to switch on polygon smoothing which is a separate process that actually alphablends/antialiases the edge of the polygon with what is behind it. I also have heard you need to enable blending and set it to a modulation mode in order for the polygons to be properly antialiased together. At least this is how I think it works in OpenGL. I'm not surprised you see jitters and stuff at the edge of your objects if you don't have polygon smoothing switched on. I noticed this on my blobby objects demo thing, where the internals are perfectly filtered but the edges were as if integer-based.

Having said all that, it is a good tip to know that adding a border around the image helps with filtering the edges.


Grey Alien(Posted 2006) [#6]
AngelDaniel: Thanks for the extra info, but I have no idea how to apply polygon smoothing in DirectX.


ImaginaryHuman(Posted 2006) [#7]
Your method is probably more efficient and less complicated anyway. :-)


Grey Alien(Posted 2006) [#8]
well it *did* work rather nicely :-)