Screen tearing with Monogame.extended and Tiled

Hello folks, I’m doing the https://www.monogameextended.net/docs/features/tiled/tiled/ tutorial, and if I use:
var seconds = gameTime.GetElapsedSeconds();
var movementDirection = GetMovementDirection();
cameraPosition += speed * movementDirection * seconds;
to control the camera position, I get with a type of screen tearing(I guess).

These happens only when I moving the camera in vertical direction and I use seconds to increase speed.
But if I go with:
cameraPosition += speed * movementDirection;
In other words, without TimeElapsed, the tearing goes away and everything works. But probable the camera going to run in different speeds for different machines.

Any help to explain to me why this is happening?
Thanks in advance.

The issue is, is the edges of the tiles are bleeding through when your camera is not a fixed int.

The easiest solution is clamp your camera position to ints. However you lose super smooth scrolling

The best option is to pad all your textures on your tile sheets with an empty pixel.

1 Like

The view can only resolve to integer positions anyway. The smooth scrolling comes from moving the camera itself by a fraction of an integer, but I believe you can still safely resolve to an int at render time and not lose anything.

The only time it might make a difference is if you were using Anisotropic filtering so it will blend the resulting texture in those sub-pixel regions… which most folks doing pixel art like this probably aren’t gonna use.

1 Like

The camera position shouldn’t resolve to integer positions. When you zoom the camera in if it resolved to integer positions the view would be taking massive skips

1 Like

Thank you guys, I have to study many things about that to really understand. for now, i’m going with integer resolution: cameraPosition += movementDirection * Convert.ToInt32(seconds * speed);.
For side scroll(up and down too) it’s works fine, without this annoying lines, but when I make a zoom:
if (state.IsKeyDown(Keys.W)) { camera.ZoomIn(0.01f); } if (state.IsKeyDown(Keys.S)) { camera.ZoomOut(0.01f); }
Doesn’t work as good as side scroll. Back to annoying lines:

Thats because when your zooming in your coordinates you are no longer clamped to an integer.

In your spritebatch draw method there is a parameter you can set to clamptopoint.

The alternative is to pad your textures on your spritesheet (i had it wrong last post its not an empty pixel)

So each pixel around the tile on your spritesheet pad it with the same pixel as the one on the edge of the tile.

1 Like

Thank you boot, all I need to fix this issue was:
resolving positions with a clamping method, as I’m using monogame I made this:
spriteBatch.Begin(transformMatrix: camera.GetViewMatrix(), samplerState: SamplerState.PointClamp)
Thank you guys again.