Solution to blurry rendering of small bitmap fonts


#1

I am using a bitmap font to display the value of some parameter in my GUI.
I’ve noticed it was being rendered as if it were drawn on the edge of two pixels vertically, rather than in its correct position, that would have been resulted in a non-antialiased rendering.

Digging into the code I found this (juce_LowLevelGraphicsSoftwareRenderer.cpp, around line 2178)

const AffineTransform transform (AffineTransform::scale (fontHeight * font.getHorizontalScale(), fontHeight) .translated (0.0f, -0.5f));

That -0.5f offset on the y axis caused the vertical blurryness. Once removed (the whole .translated method call could be removed, then), I noticed my bitmap fonts were rendered correctly in the GUI, with no noticeable difference for the other ones.

Could you correct this?


#2

Ok, I’ll take a look at that.


#3

it seems that non-bitmap font “Verdana” will also benefit from this change (with certain sizes?!), still not optimal (like cleartype) but much better to read


#4

I’ve changed this now - but only for win32, because on the mac I added that 0.5 offset to make it match the rendering of the CoreGraphics fonts.


#5

ok, for all who are interested i made some checks which verdana font sizes are good looking, left without the “translated”, at least all bottom lines will look better