drawAtPoint: and drawInRect: blurry text

Question

When drawing strings using drawAtPoint:, drawInRect: and even setting the text property of UILabels - the text can sometimes appear slightly blurry.

I tend to use Helvetica in most places, and I notice that specific font sizes cause some level of blurriness to occur, both in the simulator and on the device.

For example:

UIFont *labelFont = [UIFont fontWithName:@"Helvetica-Bold" size:12];

Will cause the resulting label to have slightly blurry text.

UIFont *labelFont = [UIFont fontWithName:@"Helvetica-Bold" size:13];

Results in crisp text.

My question is why does this occur? And is it just a matter of selecting an optimal font size for a typeface? If so, what are the optimal font sizes?

UPDATE: It seems that perhaps it is not the font size that is causing the blurriness. It may be that the center of the rect is a fractional point. Here is a comment I found on the Apple dev forums:

Check the position. It's likely on a fractional pixel. Change center to be integer value.

I rounded off the values of all my points, but there are still places where text remains blurry. Has anyone come across this issue before?

Answer 1

Pardon my ignorance if this is incorrect, I know nothing about iPhone or Cocoa.

If you're asking for the text to be centered in the rect, you might also need to make sure the width and/or height of the rect is an even number.

Answer 2

I have resolved this.

Just make sure that the point or rect in which you are drawing does not occur on a fractional pixel.

I.e. NSLog(@"%@", NSStringFromCGRect(theRect)) to determine which point is being drawn on a fractional pixel. Then call round() on that point.

Answer 3

You might want to look at NSIntegralRect(), it does what you want.

Answer 4

From my experiments, some fonts don't render clearly at certain sizes. e.g. Helvetica-Bold doesn't render "." well at 16.0f, but they're clear at 18.0f. (If you look closely, the top pixel of the "." is blurry.)

After I noticed that, I've been irked every time I see that UIView, since it's rendered dynamically.

Answer 5

I have had this problem too, but my solution is different and may help someone. My problem was text blur after changing the size of a UIView object thru TouchesBegan and CGAffineTransformMakeScale, then back to CGAffineTransformIdentity in TouchesEnded.

I tried both the varying text size and rounding of x and y center points but neither worked. The solution for my problem was to use even sizes for the width and height of my UIView !!

Hope this helps ....