Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Classic Chat / Tiles sprites showing gaps

Author
Message
SolusHunter
12
Years of Service
User Offline
Joined: 18th May 2011
Location: Kent, United Kingdom
Posted: 10th Aug 2012 17:44
I have a very basic app that is creating a 22x24 map using 250x250 pixel sprites. The app is set to use pixel coordinates.

The resolution is set as 640x960 (iPhone) and works fine on my desktop, but when I test the app on my Android tablet (ASUS TF101 running JellyBean) (1280x800) the sprite tiles have a thin gap between them, and I'm thinking it's down to the way AppGameKit has scaled the output to the device screen.

What I can do to ensure that what I see on the desktop at 640x960 is the same as on higher screen resolutions?

DarkBasic Pro 7.7 U77RC7
Windows 7 x64
Rich Dersheimer
AGK Developer
14
Years of Service
User Offline
Joined: 1st Jul 2009
Location: Inside the box
Posted: 10th Aug 2012 18:07
SolusHunter, how are you creating your media? Atlas file? Or individual images?

If you are using individual images at 250 x 250, you might try a "power of two" size for them, like 256 x 256.

Also, there are some things you can try with image/sprite U/V border settings.

If you would post a short example of code that exhibits the behavior, with one of the tile images, I'm sure the problem can be fixed.

XanthorXIII
AGK Gold Backer
12
Years of Service
User Offline
Joined: 13th May 2011
Location:
Posted: 10th Aug 2012 18:08
Are you switching the resolution in your app to match the device you are testing on? You may want to make sure you are getting the device resolution and then set that in the app. I haven't seen your code so I don't know how you are handling it.
Cliff Mellangard 3DEGS
Developer
18
Years of Service
User Offline
Joined: 20th Feb 2006
Location: Sweden
Posted: 10th Aug 2012 20:39
You should think of that even if you set an virtual resolution so is it the native resolution that is used.

Open gl simply scales all the media to fit the screen and uses percentage scaling natively.

And as rich wrote so test the uv border command that usually fixes this.
But in some cases so will you get this effect also because the version of open gl agk uses is actually 3d with an camera modified to give the illussion of 2d.

In this case so can you simply fix this by giving an extra float value on its size.

128+0.5

Now so does the tiles slightly overlapp each other but the user cant see it.

Android 2.3 Gingerbread , ZTE Skate , 480x800 , 800 mhz cpu , Samsung Galaxy Y , 240x320 , 832 mhz cpu
Android 4.0 Sandwich , Dmtech 3g 9738B , 1024x768 , 9.7 inches , cortex A8 1.2 cpu , 1 gb ram.
SolusHunter
12
Years of Service
User Offline
Joined: 18th May 2011
Location: Kent, United Kingdom
Posted: 13th Aug 2012 10:33
Thanks for the insight on this. I tried all the suggestions and here are my findings (for the record):

SetSpriteUVBorder(sID,1) - this didn't change anything at all, the black outline was still showing

Changing sprite size to 256x256 - no change

Using a float to slightly overlap - oddly enough this partially worked. Some borders would show, some wouldn't, but the overlap was obvious in places.

Set the Virtual Resolution to getDeviceWidth/Height - this worked, and I thought this would probably bet he best option anyway. SetViewZoom however does show gaps again, so I'm going to have to use a more sophisticated method of zooming in the map. No biggy.

Here's the code I'm using to load and create my map grid, in case anyone is interested:




I presume that using the device resolution is the best option for mobile apps anyway?

Also, I'm little concerned over texture memory usage. There doesn't seem to be a command in AppGameKit to find out how much the app is using at any given time, Is there one or does AppGameKit work differently.

The app I'm trying out was also built using Corona SDK (cough), but with that trying to load all 575 map tiles at once caused all devices to crash. IT seems that Corona immediately loads all images to texture memory causing all sorts of issues; but AppGameKit seems to work more like DBPro and only converts to textures when needed. Is this true?

DarkBasic Pro 7.7 U77RC7
Windows 7 x64
Marl
12
Years of Service
User Offline
Joined: 19th Nov 2011
Location: Bradford, UK
Posted: 13th Aug 2012 15:42
You could try using floats for coordinates. I've fixed a few gap problems this way.

At first it seems odd - particularly if using unscaled sprites in native res. Its only natural to think in terms of whole pixels since "pixel" is the smallest screen unit and physically can only be one colour at once.

However we are not popping pixels onto a raw bitmap - there's all sorts of stuff going on under the hood to maintain cross platform and cross device support (including the already mentioned OpenGL shenanigans) so you have to get past any pre-conceptions of what a pixel is or isn't and just go with it
Rich Dersheimer
AGK Developer
14
Years of Service
User Offline
Joined: 1st Jul 2009
Location: Inside the box
Posted: 13th Aug 2012 20:38 Edited at: 13th Aug 2012 20:47
A couple of things...

Using both SetVirtualResolution() and SetDisplayAspect() in the same program is sort of counter-productive. It doesn't really hurt anything, but you don't get the result you expect.

SetDisplayAspect() is for when you want to consider the screen in percentages. The screen is 100% wide and 100% tall, and all your sprite sizes and positions are in relation to this. The middle of the screen is x 50 and y 50. If you want to size your sprites so that you can see a grid of 3 sprites across and 4 down, you would size them at width 33.3 and height 25.0.

SetVirtualResolution() is for using pixel coordinates. If your virtual resolution is 640 by 960, and you want the same sprite distribution as above, the sprite size would be width 213.33333 (640 divided by 3) and height 240.0 (960 divided by 4).

If you set your virtual resolution to your device size, then the position and size of your sprites will vary greatly from device to device. Some of your sprites might not be visible, etc.

Now, since you are going to use sprites of a fixed size (250 by 250), you will need a virtual resolution that will show the number of sprites that you want to see on the screen. At a virtual resolution of 640 by 960, you will see about 2 and a half sprites across, and almost 4 sprites down.

Of course zooming out the view will show more sprites, and I'm guessing that's your plan.

Personally, I would use the highest virtual resolution among your target devices, and let AppGameKit automatically scale everything down for any other devices. Some folks will say that using the smallest resolution is the way to go, letting AppGameKit scale up. It's up to you, and your mileage may vary.

BTW, the resolution set in the setup.agc file is really just for sizing your display window in the "windows" environment. It won't affect the display on mobile devices, but it helps visualize the program if you use one that fits on the screen, with the same aspect ratio as your favorite mobile device.

Okay, now as far as your problem with the black lines, I can't reproduce it. I'm running a modified version of your code posted...



I see no black edges on either my HTC Incredible phone, or my Kindle Fire. Both are Android devices. Also no black edges on my iPad and iPod Touch, and windows.

I guess you are assigning images to the sprites later, and this makes me wonder if the sprites are changing size when the new image is applied. Are you resetting the sprite size after the SetSpriteImage() command?

Anyway, like I say, I'm seeing no black edges with the revised code. Do you have a simple snippet that would illustrate the problem? If the code above is showing black edges, then maybe it's a device specific problem?

SolusHunter
12
Years of Service
User Offline
Joined: 18th May 2011
Location: Kent, United Kingdom
Posted: 14th Aug 2012 10:24
Here's my full code sample. It's a bit rough around the edges at the moment because I've only been running tests with AppGameKit for the past few days:



As you'll see in the code I resampled all the sprites to 256x256. This actually did get rid of all the black edging I was seeing. But if you can see something wrong that I'm doing please let me know.

The device I'm using is an ASUS Transformer TF101 running a custom ROM Team EOS3 Jelly Bean 4.1.1, it's an nvidia Tegra 2 device.

DarkBasic Pro 7.7 U77RC7
Windows 7 x64
Paul Johnston
TGC Developer
21
Years of Service
User Offline
Joined: 16th Nov 2002
Location: United Kingdom
Posted: 14th Aug 2012 21:58
The SetSpriteSnap(ID,1) command may help you here, it will avoid half pixel boundaries when scaling to a different device resolution, which can cause gaps and borders to flicker.

Quote: " AppGameKit seems to work more like DBPro and only converts to textures when needed"


When you call LoadImage AppGameKit loads the image into graphics memory ready for use, even if it is never used again.
Cliff Mellangard 3DEGS
Developer
18
Years of Service
User Offline
Joined: 20th Feb 2006
Location: Sweden
Posted: 14th Aug 2012 23:42
Quote: "SetSpriteSnap(ID,1)"

Will give you an wave like effect on an scrolling tile map.
I have tested it

Android 2.3 Gingerbread , ZTE Skate , 480x800 , 800 mhz cpu , Samsung Galaxy Y , 240x320 , 832 mhz cpu
Android 4.0 Sandwich , Dmtech 3g 9738B , 1024x768 , 9.7 inches , cortex A8 1.2 cpu , 1 gb ram.
Digital Awakening
AGK Developer
21
Years of Service
User Offline
Joined: 27th Aug 2002
Location: Sweden
Posted: 15th Aug 2012 00:09
I have no problems using SetSpriteSnap. Finally got around to testing it myself. Smooth scrolling and no glitching for me. However, I have filtering turned off and using 200x120 resolution for my retro look.

Cliff Mellangard 3DEGS
Developer
18
Years of Service
User Offline
Joined: 20th Feb 2006
Location: Sweden
Posted: 15th Aug 2012 01:00
Quote: "I have no problems using SetSpriteSnap. Finally got around to testing it myself. Smooth scrolling and no glitching for me. However, I have filtering turned off and using 200x120 resolution for my retro look."

I get a wave effect on my detailed tiles with alot off patterns.
Due to that the snap updates in whole pixels.

Its more or less how detailed the tiles are.

And turning off the filtering is a solution in its own but will give gaps in some cases when moving.

Android 2.3 Gingerbread , ZTE Skate , 480x800 , 800 mhz cpu , Samsung Galaxy Y , 240x320 , 832 mhz cpu
Android 4.0 Sandwich , Dmtech 3g 9738B , 1024x768 , 9.7 inches , cortex A8 1.2 cpu , 1 gb ram.
The Daddy
15
Years of Service
User Offline
Joined: 13th Jan 2009
Location: Essex
Posted: 17th Aug 2012 12:45
This may be an OpenGL issue, I remember having a similar problem I had for a tiled map I created to play with ogl but had to change the clamping of texture to quad.

Not very useful but may point you in a direction.....?

Constantly seeking!
DVader
20
Years of Service
User Offline
Joined: 28th Jan 2004
Location:
Posted: 27th Aug 2012 16:13
I have had this sort of problem on a regular basis. For instance when running in a window on PC it can look okay, maximise the window and artifacts and gaps start to appear. As people have said it is an issue with AppGameKit resizing sprites that seems to cause it.
If you haven't tried them these commands can help. SetDefaultMagFilter( filter ). SetDefaultMinFilter( filter ).
Also I notice you use both set virtual resolution and set display ratio. I discovered that combining them can actually cause black lines across the screen. Try using one or the other, not both.
Hope that helps!

Login to post a reply

Server time is: 2024-05-06 08:50:51
Your offset time is: 2024-05-06 08:50:51