CODEWITHSUNDEEP
iphonecocoa-touchuikit
HelloMoon
HelloMoon

Reputation:

How to let the text in a UILabel appear blurry?

Is there a way to achieve a blurry or glowing effect for the text? Or would I have to fetch the graphics context of the layer and then apply some kind of gauss algorithm on the pixels? I searched the documentation on this but it appears that shadows don't draw blurry and there's no method in NSString, UIFont or UILabel that could help to do it.

Upvotes: 1

Views: 3670

Answers (4)

rpetrich
rpetrich

Reputation: 32316

CGContextSetShadowWithColor can be (ab)used to draw blurred text. As it can be slow, it is best to draw it to a buffer and then reuse that:

UIFont *font = [UIFont systemFontOfSize:18.0f];
UIGraphicsBeginImageContext(CGSizeMake(200.0f, 50.0f));
CGContextSetShadowWithColor(UIGraphicsGetCurrentContext(), CGSizeMake(0.0f, -500.0f), 2.0f, [[UIColor blackColor] CGColor]);
[@"Blurred Text!" drawAtPoint:CGPointMake(5.0f, -500.0f) withFont:font];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[imageView setImage:image];

Old answer: A simple option is to draw the text a number of times and offset the x/y coordinates by 1 each time. To speed it up you can cache it on an offscreen buffer.

Upvotes: 3

Matt Long
Matt Long

Reputation: 24466

You can intentionally position the label on a half pixel and you'll get a blurry effect. You won't have much control over it, but it will look blurry:

UILabel *labelOnWholePixel = [[UILabel alloc] 
                   initWithFrame:CGRectMake(20.0f, 20.0f, 280.0f, 25.0f)];
[labelOnWholePixel setText:@"Whole Pixel"];
[labelOnWholePixel setBackgroundColor:[UIColor clearColor]];

UILabel *labelOnHalfPixel = [[UILabel alloc] 
                  initWithFrame:CGRectMake(20.5f, 50.5f, 280.0f, 25.0f)];
[labelOnHalfPixel setText:@"Half Pixel"];
[labelOnHalfPixel setBackgroundColor:[UIColor clearColor]];

[[self view] addSubview:labelOnWholePixel];
[[self view] addSubview:labelOnHalfPixel];

I'm not sure, but it appears to me that the closer you are to the whole number in either direction, the clearer it gets, so you can control it a little.

Upvotes: 1

Corey Floyd
Corey Floyd

Reputation: 25969

Use photoshop or some other image editor to create a clear, blurry overlay. Save as a PNG. Load this PNG into an UIImageview and draw it on top of the UILabel. Adjust the alpha to alter the effect.

You could even create a specialized UILabel subclass to handle this with several degrees of blur.

Upvotes: 0

fbrereto
fbrereto

Reputation: 35925

Aside from antialiasing UILabel does not support blurring its text (or its shadow). You'll have to code it manually.

Upvotes: -1

Related Questions