SFML community forums

Help => Graphics => Topic started by: Voroz on March 20, 2010, 12:31:20 pm

Title: blurry edges
Post by: Voroz on March 20, 2010, 12:31:20 pm

Hi. I have a problem with scaling. It keeps scaling back and forth, causing blurry edges. This is causing the same edges as i had when the character wouldn't stop moving proerly, so he moved back and forth between 2 frames close to eachother, causing this blurry edge look. Now he does it, but because of scaling.

I know this because it works without scaling, and the SetCenter location is not blurry, so it's caused by the scaling.

The question is. Why does it do that? I will post zoomed in pics to show you what i mean.

This is how it looks with scaling:
(http://img208.imageshack.us/img208/6651/blurr.png)

This is where i scale and draw char location:

Code: [Select]

//Set Scale
Character.SetScale(character.y / screenHeight, character.y / screenHeight);

//From struct to drawable
Character.SetPosition(character.x, character.y);

Anyone have any ideas what it could be?

Title: blurry edges
Post by: model76 on March 20, 2010, 06:04:39 pm

This happens because the pixels of the image does not fit the pixels on screen, exactly. So if a screen pixel could be either the spite- or background-color, it will be up to SFML and the system it relies on to decide what color a pixel will be.

Your best bet is to make sure the pixels of your sprite fits the pixels on screen at the current zoom level, before you draw them. Does that make sense?


Laurent - It would be really cool if this could be done by SFML. Maybe in SFML 2?

Title: blurry edges
Post by: Voroz on March 20, 2010, 09:44:52 pm

ehm ok.. and how would i make sure that they do that?

Title: blurry edges
Post by: model76 on March 21, 2010, 07:02:29 am

I haven't quite figured it out yet, sorry. So if someone has a solid solution, I would be interested to see it, too.

I can tell you that it involves scaling the sprite to fit the screen pixels, though.

I do, however, use something slightly similar in my current project, to draw lines. So I could show you that, if you are interested, but I don't think it can be directly translated, though, and maybe it is a little messy, too...

EDIT:
Argh, I see now that you were actually talking about scaling your sprites, and I had somehow gotten it into my head that you meant zooming the view...

In that case, just make sure that you always scale to a whole number.
So if you have a float scale variable, then you just do:

Code: [Select]

const float &flooredScale = floor( scale );
sprite.Scale( flooredScale, flooredScale  );Or maybe more correctly:

Code: [Select]

const float &roundedScale = floor( scale + .5f );
sprite.Scale( roundedScale, roundedScale );

Title: blurry edges
Post by: Laurent on March 21, 2010, 11:41:14 am

Quote

Laurent - It would be really cool if this could be done by SFML. Maybe in SFML 2?

Automatic rounding of coordinates was done in SFML 2, but I had to remove it because it created other problems that were impossible to solve.
Therefore, you still have to properly align your drawables in SFML to get pixel perfect rendering.

Title: blurry edges
Post by: Voroz on March 21, 2010, 12:15:03 pm

does this mean that the scaling has to be done so the resulting width / height becomes an integer?

Title: blurry edges
Post by: Laurent on March 21, 2010, 12:53:22 pm

Yes.

Title: blurry edges
Post by: Voroz on March 21, 2010, 01:14:03 pm

Ok this is very weird. I no longer get this issue. in older builds i still get it, although i no longer have the source code of these builds. It's just very weird because i haven't changed anything that should have anything to do with the issue. I have been adding some trees, and that's mostly it..

edit: hah. stripped the code alot and still no problem, so i started checking settings. I had changed anti-aliasing from 2 to 0, and that was my problem, so i don't know what you are all going on about pixels matching etc ^^.

To clarify. 2 aa was bad, 0 is good.

Title: blurry edges
Post by: model76 on March 22, 2010, 01:06:47 am

Quote from: "Laurent"

Quote

Laurent - It would be really cool if this could be done by SFML. Maybe in SFML 2?

Automatic rounding of coordinates was done in SFML 2, but I had to remove it because it created other problems that were impossible to solve.
Therefore, you still have to properly align your drawables in SFML to get pixel perfect rendering.

I see. Then I it would be really helpful if the tutorial showed how to do that.

By the way, I have been skimming the tutorial for 1.6, and it looks like it has a lot of new information. Very cool! :D

Title: blurry edges
Post by: Laurent on March 22, 2010, 08:06:20 am

Quote

I see. Then I it would be really helpful if the tutorial showed how to do that

It would be helpful to have tutorials for SFML 2 ;)

Quote

By the way, I have been skimming the tutorial for 1.6, and it looks like it has a lot of new information

Really? I didn't know :lol:

Title: blurry edges
Post by: model76 on March 22, 2010, 02:56:22 pm

Quote from: "Laurent"

Quote

By the way, I have been skimming the tutorial for 1.6, and it looks like it has a lot of new information

Really? I didn't know :lol:

Haha - I take it back - I must have been seeing things, because now they look exactly the same. Too much coffee, I guess  :lol: