Screen Tearing / Warped Tiles

Extended
1

I’ve tried using:

SynchronizeWithVerticalRetrace = true;

Changing to supported resolutions, altering the camera zoom.

I have tiles that are warped:

Any assistance would be appreciated!

2

That’s not screen tearing I’m afraid, what’s happening is you’re scaling by a non integer number.

For example if you scaling your images to exact whole numbers, (2, 3, 4, etc.) you get things looking correct. If your scaling isn’t an integer you’ll get inconsistent scaling across the pixels when using nearest-neighbour filtering.

Another way to explain would be, imagine scaling an image that is 256 pixels wide to be 510 pixels wide, since 256 does not divide into 510 exactly (it does into 512) what will happen is 2 vertical lines of pixels will only be drawn 1 pixel wide while the other 254 lines will be 2 and so you’ll get this kind of thing happening. Same thing happens with scaling vertically as well.

Here’re a few suggestions to help avoid this, with 'but’s on each:

  • User linear filtering instead of nearest-neighbour. But this will make everything look blurry and lose a lot of the pixel-art style.
  • Strictly control your image scaling to ensure only integer scaling is processed. But this won’t work if you want to be able to smoothly zoom in and out of your scene and different resolutions may have different visible areas.
  • Draw everything to a fixed size using a RenderTarget2D and use a shader that super-samples that to your final resolution taking the scale into consideration and blending where it needs to to avoid the inconsistent pixel sizes. But, this one is a bit advanced and you’d need to either know your way around shaders or find someone who could write it for you. In addition, it may lose some of the pixel art style, although not to the extent of the first option.

Other people may have better suggestions.

3

I’ve not done 2D for a while but is there an orthogonal camera in your code? If yes you could use it to zoom in or out by playing with the matrices and maybe scale it in an easier way?

4

Thank you for that information. However, the scaling issue is a separate problem. The warped tiles are due to the Zoom within the Monogame.Extended library. I’m literally getting screen tearing as if VSync wasn’t enabled. All across the screen. The only work around I found was to launch a borderless fullscreen window and not in fullscreen mode. Even then performance takes a hit.

5

Yes Ive tried that. The Camera.Zoom method is part of the Extended library. At it’s default it’s fine but I’d have to redo my art. At 4 where it’s at now, it warps the tiles.

6

It’s essentially just a scale matrix last time I checked. The code is there for free; you are more than welcome to fork or download the code and debug and edit the codebase to meet your needs.

EDIT: The only thing I can think of that can screw things up potentially is the viewport adapter scaling.