Hi. I have a simple map renderer which uses a vertex array and a spritesheet. I also have a camera class which feeds the renderer with precalculated amounts of horizontal and vertical tiles which can be seen with the current resolution. My base resolution (resolution which the sprites are made for) is 1080 px height and my map cell is 45 px height. So for example when I run a 640 x 480 px window there are rendered 32 x 24 tiles. But this is not really important. The problem is when using a vertex array and scaling the quad positions. It's important to say that I am using setSmooth(true) on my spritesheet texture and forcing roundf() inside quad position parameters so they are integrals.
quad[0].position = sf::Vector2f(roundf((x * cellDimension.x) * scale), roundf(verticalPositionInWindow * scale));
quad[1].position = sf::Vector2f(roundf((x * cellDimension.x + frameDimension.x) * scale), roundf(verticalPositionInWindow * scale));
quad[2].position = sf::Vector2f(roundf((x * cellDimension.x + frameDimension.x) * scale), roundf((verticalPositionInWindow + frameDimension.y) * scale));
quad[3].position = sf::Vector2f(roundf((x * cellDimension.x) * scale), roundf((verticalPositionInWindow + frameDimension.y) * scale));
It works great without any artifacts when downscaling from 1080 px or simply the scale value is <= 1.0. There are no glitches and black lines or any sprite bleedings. However when upscaling from 1080 px or simply the scale value is > 1.0 there are black lines drawn onto the screen, white lines, sprite bleeding. Probably you know what I mean, it's a common problem with bilinear scaling method, so when I have the quad set to a greater size than texture piece size it becomes strangely interpolated causing artifacts and glitches. I tried to add padding to my spritesheet but still at best I ended with grey lines between tiles.
Another way which I wanted to try is to create a 1080 px in height RenderTexture. The vertex array is drawn simply without scaling onto this texture, then the sprite with this texture is scaled to any value I want and finally this sprite is drawn to the window. The result is the same as previously but there are no artifacts and glitches since this is just a prerendered texture, single image which I can transform freely without this spritesheet interpolation mess.
Which way should it be done properly? I think that rendering a texture with a size of base resolution isn't good idea considering performance. But this way it just works. If I want to go with first solution it will be surely way faster but I don't know how to solve upscaling problem with spritesheet.
Show Posts
