Warped Pixels?

Graphics
1

Hi, so in my game, I’m using 16x16 tiles. These display properly at any zoom ratio in Tiled and draw fine when Scale is set to 1, however, if I set the scale used in my Matrix.CreateScale() method to 2 or higher, then I get weird, warped pixels.

Can anyone help me sort this out?

I have a sample screenshot here and have outlined the warped pixels.

Edit: In hindsight, while looking at this, I realized that its not just there, several of the pink bars are also significantly wider than they should be. yeah, I’m very confused right now.

2

Can you post your scaling code?

3

Camera defines the transform as:
_transform = Matrix.CreateScale(new Vector3(Scale, Scale, 0)) * Matrix.CreateTranslation(new Vector3(-_center.X, -_center.Y, 0));

Edit: center is the player location, ie the center of the screen, ideally.

then when I go to draw:
spriteBatch.Begin(SpriteSortMode.FrontToBack, BlendState.AlphaBlend, SamplerState.PointClamp, null, null, null, Camera._transform);

I notice that the warped pixels seem to be the pixels immediately on the tile boundaries
Edit: Further looking indicates that the tiles in the 0 row and column are the ones that are affected,

4

Try 1 as the scale for the Z. I had issues with 0 recently and was wondering what was wrong. Setting the scale to negative values caused some of my objects to not render when flipped, and zooming in prevented others from showing up properly. Hopefully that works out for you.

5

it did not :frowning:

6

Try doing a translation before a scale. Instead of:

transform = Matrix.CreateScale(new Vector3(Scale, Scale, 0)) * Matrix.CreateTranslation(new Vector3(-center.X, -_center.Y, 0));

do:

transform = Matrix.CreateTranslation(new Vector3(-center.X, -centerY, 0)) * Matrix.CreateScale(Scale, Scale, 1);

7

nope, found something though. Apparently it has to do with pixeloffsetmode.Default

Only problem is I have no idea where that is being used to change it.

Edit: and that apparently has to do with the Graphics library and OnPaint commands and may not be applicable here.

Edit: Now I’m noticing that this distortion is ONLY happening with the tiles on my map, and not at all with the other sprites. This suggests something is messed up with my TiledMapRenderer

8

Yeah, problem with the bloody renderer itself.

9

Make sure you only scale and translate by whole numbers so the pixels stay aligned. Generally for pixel art games, it’s a good idea to render at native resolution to a render target and upscale it when drawing to the backbuffer (again only scaling by whole numbers).

Seems unlikely that this would be a bug in the rendering engine to me, I’m not sure what kind of bug you could have that causes this.

I really like the artwork btw :slight_smile:

1 Like
10

Yeah, I’m only scaling by multiples of 2 which shouldn’t be an issue.

I did try the rendertarget thing, but it caused additional problems and didn’t seem to fix this one. I’ll be going back to looking at it in the future though since I do need to figure out how to handle multiple resolutions.

Thanks :slight_smile:

1 Like