UV not correct on tiles in scaled window.

[TomToad]

Making a tiled game using Tier 1.  When the window size matches the virtual resolution, I have no problems, but when the window is scaled, I get the surrounding tiles bleeding through, like the UV on the sprites is off by 1.  Tried padding the tiles with a 1 pixel border.  Still looks great when window size = virtual size, but I get gaps when the window is sized.  How does everyone here deal with this?

[Rick Nasher]

Hmm..
Do you have some example code to test?

[TomToad]

Code Select Expand


// Project: test
// Created: 2018-02-07

// show all errors
SetErrorMode(2)

// set window properties
SetWindowTitle( "test" )
SetWindowSize( 800, 600, 0 )
SetWindowAllowResize( 1 ) // allow the user to resize the window

// set display properties
SetVirtualResolution( 800, 600 ) // doesn't have to match the window
SetOrientationAllowed( 1, 1, 1, 1 ) // allow both portrait and landscape on mobile devices
SetSyncRate( 30, 0 ) // 30fps instead of 60 to save battery
SetScissor( 0,0,0,0 ) // use the maximum available screen space, no black borders
UseNewDefaultFonts( 1 ) // since version 2.0.22 we can use nicer default fonts

image = LoadImage("test.png")
sprite = CreateSprite(image)
setspriteanimation(sprite,128,128,4)


do
for x = 0 to 4
for y = 0 to 4
setspriteposition(sprite,x*128,y*128)
SetSpriteFrame(sprite,(x && 1) + 1)
DrawSprite(sprite)
next
next

   

    Sync()
loop


When first run, you will see a bunch of circles and lines tiled onto the screen.  Everything looks as expected.  Try resizing the window, and you will see a bunch of lines from the two lower tiles at the edge of the tiles.  Replace the image with the padded one, and change the SetSpriteAnimation parameters to 129 to account for the 1 pixel padding.  Once again, when the window is at the same size as the virtual resolution, everything looks normal, but when resized, gaps appear.

[Rick Nasher]

Hi,

Did the disable mipmapping solve this?

Assuming you mean the horizontal lines in between the tiles, I must honestly say that I didn't any differences, regardless using SetImageMinFilter(image,0) or mipmapping. I've tested on my laptop and phone.

[Edit]
Weird.. It looks a bit like the discussion I've seen about terrains.
https://forum.thegamecreators.com/thread/221265

Perhaps the images should be like that:
"should be a (power of 2) -1"
in effect: 255 x 255?

Or no, actually:
setspriteanimation(sprite,127,127,4)
I do not see the issue anymore using above line.

Code Select Expand

//SetGenerateMipmaps(0)
image = LoadImage("test.png")
//SetImageMinFilter(image,0)
sprite = CreateSprite(image)
setspriteanimation(sprite,127,127,4)

No need for the other commands also, so it seems.

[TomToad]

Finally got this one figured out.  Using both SetImageMinFilter(ImageID,0) and SetImageMagFilter(ImageID,0), along with SetSpriteUVBorder(SpriteID,0) works.  Thanks for everyone's help.

[Rick Nasher]

Good to hear. Do you also know the background why it works ok like that?

[TomToad]

Not really sure why.  SetImageMinFilter and SetImageMagFilter affect the sampling of the pixels when the image is scaled, so that makes sense and is all I need for it to look ok on my PC.

As for SetSpriteUVBorder, that command adjusts the UV of the sprites by a small amount to prevent sampling nearby tiles.  It defaults to 0.5 which means it is cropping off a half pixel border from the image.  So setting it to 0 should theoretically make things worse, but it doesn't.  It actually fixes the problem.  I'm wondering if there is a bug in the Android AGKPlayer.

Just checked it out.  Setting the parameter to 0.5 actually looks ok on android.  Leaving it default makes things worse.  So obviously, it is not defaulting to 0.5 nor 0.  So I am pretty sure it is a bug.

[Rick Nasher]

Did you notice that what I posted also works?