The image on the link below consists of 20+ images(each body part and armor type in seperate files). This character is animated in the software called "Spriter". The code takes spriter's output file (.scml) then calculates the body parts' and armor parts' positions and rotations every frame.

When there is no rotation, everything draws smoothly but when there are rotating parts , sprites get drawn a little distorted as seen on the gif below:

Here's the gif

Can this distortion problem be solved?


Those artifacts appear to be from a lack of smoothing, which is great for pixel art, but not so great for vector art and things that rotate.

To enable smoothing, simply find the sf::Texture(s) for each body part, and call setSmooth(true) on each one.

Official documentation here

The difference lies in how each on-screen pixel (or fragment) of the the texture will be rendered when the texture coordinates it maps onto fall inbetween texture pixels (or texels). Such misalignment occurs easily when you perform scaling, fractional translation, and rotation.

With smoothing turned on, each fragment is rendered by interpolating several texels that are nearest to its calculated texture coordinates. If a fragment's texture coordinates fall between texels, then you'll see a tiny amount of blending happening.

Otherwise, with smoothing disabled, each fragment is rendered simply by choosing the single texel closest to its calculated texture coordinates, and performs no interpolation. In this case, when a fragment's texture coordinates fall between texels, simply one or the other texel is chosen. This results in the jagged, blocky rotation artifacts you are seeing.

Note that for things like densely-packed spritesheets, smoothing can have the effect of neighbouring texture data "bleeding" into the current sprite.

  • worked like a wonder. thank you. – Ozan Deniz May 15 at 21:21

Your Answer

