3

I am making a 2d platformer and I decided to use multiple tilemapnodes as my backgrounds. Even with 1 tile map, I get these vertical or horizontal lines that appear and disappear when I'm moving the player around the screen. See image below:

enter image description here

My tiles are 256x256 and I'm storing them in a tileset sks file. Not exactly sure why I'm getting this or how to get rid of this and it is quite annoying. Wondering if others experience this as well.

Considering to not use the tile maps, but I would prefer to use them if I can.

Thanks for any help with this!!!

Discoveringmypath
  • 1,049
  • 9
  • 23
  • 3
    make sure you are using Int positions and not Floats, (Basically use whole numbers) The rounding will cause gaps in your game – Knight0fDragon May 10 '17 at 15:56
  • Thanks for the tip, definitely something I didn't think of before that I will keep in mind. Although, I'm not currently moving the position of the tile maps and they are set to Int's initially. – Discoveringmypath May 10 '17 at 22:18
  • Switft is weird, you need to manually check the values are int, because it will change it on you – Knight0fDragon May 11 '17 at 03:12
  • Doesn't appear that it is doing that, or as far as I can tell. I printed the the position and it was the same as what I specified in the sky file. I just printed it from the did Move function. – Discoveringmypath May 11 '17 at 03:23
  • @Knight0fDragon, did you have any other ideas? I feel like without tilemapnodes I will loose in efficiency, so I'm trying to give them a chance if I can. – Discoveringmypath May 15 '17 at 20:20
  • do you have a project I could play with? – Knight0fDragon May 15 '17 at 20:21
  • I don't know why I'm uncomfortable posting on git hub, I can email you the project if I can get that from you... – Discoveringmypath May 15 '17 at 20:22
  • knight0fdragon@gmail.com – Knight0fDragon May 15 '17 at 20:23
  • From what I can tell, you are relying on the system to scale for you, and this may be causing the problems, I am going to play with adding 2x and 3x graphics – Knight0fDragon May 16 '17 at 12:03
  • For the contact tilemapnode I have scaled the tile size down, but for the sky tilemapnode I don't scale. Same issue with the lines with or without the contact tilemapnode. Thanks for taking the time to look at my issue. Are you able to duplicate the glitchy lines on your side? – Discoveringmypath May 16 '17 at 21:50
  • @Knight0fDragon thanks, this fixed it for me; also making sure the camera position if rounded to floats. – hotdogsoup.nl Jul 20 '21 at 21:31

2 Answers2

1

I had the same issue and was able to solve it by "extruding" the tiled image a couple pixels. This provides a little cushion of pixels to use when the floating point issue occurs instead of displaying nothing (hence the gap). This video sums it up pretty well.

Unity: extruding tile map images

If you're using TexturePacker to generate your sprite atlas' there is an option to add this automatically without having to do it to your tile images yourself.

Hope that helps!

cheaze
  • 187
  • 1
  • 14
0

Sort of like the "extruding" suggested by @cheaze, I simply make the tile size in the drawing code a tiny amount larger than the required tile size. This means the assets themselves do not have to be changed.

Eg. if you assets are sized 256 x 256 and all of your calculations are based on that; draw the textures as 256.02 x 256.02 pixels in size:

[SKSpriteNode spriteNodeWithTexture:texture size:CGSizeMake(256.02, 256.02)];

Only adding .02 pixel per side will overlap your tiles automatically and remove the line glitches, depending on your camera speed and frame rate.

If the problem is really bad, you can even go so far as to add half a pixel (+0.5) or an entire pixel to remove the glitches, yet the user will not be able to see the difference. (Since a one pixel difference on a retina screen is hard to distinguish).

hotdogsoup.nl
  • 1,078
  • 1
  • 9
  • 22