Ugly Image Borders with SMOOTHSHADING TRUE or FALSE

[galiksoft]

Hi people.

My game uses some circular icons in top of the screen. They are 256x256 png images with transparency. I use polyvector comands to resize these icons to the proper relative size (this is an android game).
The final result are ugly borders. I know I must use SMOTHSHADING FALSE. I dit that, but they are ugly too...

I made a project to show for you see and help me. It just draw the wallpaper and put 3 icons (images) in top (with SMOOTHSHADING FALSE), and the same 3 icons in bottom with SMOOTHSHADING TRUE. As you can see, the images in top screen are better but the borders are not perfect...

How can I do to draw perfect icons and perfect borders?

Please download these project here:   http://galiksoft.is-great.org/bordas.zip
(if it doesn't work, copy the url and paste in the url bar of your browser...)

Thank you

[erico]

I get the ugly antialiase borders too.
The images sources look ok though (the pngs, nice icons by the way).

I get different results depending on GFX board settings.
Do they look ugly on the phone too?

[mentalthink]

Hi I never have problems whit the borders of images, in Desktop Pc or in any device... I usually put the .png to 24. bits of Depth... when I render in 3ds Max... or another 3d Suite.

[MrTAToad]

Worth disabling anti-aliasing in your video card

[erico]

Hi I never have problems whit the borders of images, in Desktop Pc or in any device... I usually put the .png to 24. bits of Depth... when I render in 3ds Max... or another 3d Suite.

Works fine, but re escaling in GLB things are not quite using a bilinear interpolation, which I guess is what is cousing pixels...GFX board (+open gl) plays a role here I guess.
If for android, I wonder how it goes.

[spacefractal]

I have not checked this as I'm are not home. I have seen a similar issue which happens with poly vectors and you resize them bigger than original size. So try not to uses floats, which could minimize the issue.

I don't think it's a glbasic error, but more how the graphics card scaling.

[erico]

I haven´t had issues with drawsprite, scale or rotate on this front...
I tried polyvector with a test on caanoo and pc, and had not issues on (not beta11) glbasic.
But maybe it was because everything is black and white?

@galiksoft , how does it look on an android device? Which version of GLB are you using?

[galiksoft]

I didn't try in an android phone because I don't have one.

I use GlBasic 10

" I have seen a similar issue which happens with poly vectors and you resize them bigger than original size..."
In this case, the images are resized smaller (very much) than the original size...

If I just draw the original image with original size, I don't get issues...

Maybe If I make a smaller original image, the resized image would look nice.
I will try that...

More suggestions?

Thank you

[MrTAToad]

Usually its the graphic card anti-aliasing settings that cause the problem - have you tried switching it off?

[fuzzy70]

Usually its the graphic card anti-aliasing settings that cause the problem - have you tried switching it off?

Only trouble with that approach is If that fixes it there is no guarantee that the problem won't show on another persons PC. Thanks to PC driver's options of off/on/app controlled you cannot tell what a 3rd persons settings are.

Does SMOOTHSHADING FALSE force the driver to disable anti-aliasing or just the current items being drawn (then the gfx card anti-aliases automatically when the screen is drawn if user has forced it on)?

Lee

Sent from my GT-I5700 using Tapatalk 2

[MrTAToad]

I think it does - mostly.  I think various settings can over-ride it or at least affect it when scaling an object though.

Would it be possible to post what the graphics look like ?

[erico]

This is what it looks like my end, with the gfx board set to app controlled.
I scaled it 200% up on photoshop without interpolations so to preserve original pixels and make it easier to see.

I´m also appendind @galliksoft original pause button so you see this is a real big rescale.

The ugly borders I get are a few white dots on the top images.
The original png has a very thin white outer line and that does not interpolate ok by the gfx board.
By using photoshop to bilinear interpolate it to the actual app size, thing is still cool.

I would recommend using smaller originals and to be aware of very thin lines if you want it to look ok everywhere.

[attachment deleted by admin]

[Hemlos]

I didnt test it, dont have the time, but here is some things to keep in mind..

Always make the images power of 2 in size...eg. 8x8 16x8 8x32 32x128 etc etc
Images with transparencies should have transparent pixels all around the main image...you dont want the colored part touching the edges.

[Kitty Hello]

V11 - btw - uses ALPHATESTING FALSE; ALPHAMODE -1 by DEFAULT now!!
This will probably remove these borders automatically now.