views:

686

answers:

4

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.

+1  A: 

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

fbrereto
How would that look like in theory? Would I grab a copy of the graphics context and apply a gauss algorithm to it, and then assign that back to the layer?
HelloMoon
You'd probably want the UILabel to draw itself into an offscreen buffer (by creating a temporary context in which it should draw, then calling its drawRect routine), then get the UIImage of that buffer to perform the blur. See here for offscreen buffer APIs:http://stackoverflow.com/questions/1315251/how-to-rotate-a-uiimage-90-degrees/1317194#1317194
fbrereto
I see. Thanks. So with that graphics context I would have to apply some gauss algorithms and draw them back, right?
HelloMoon
That's the approach I'd take, anyhow...
fbrereto
A: 

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.

Corey Floyd
err....no. That won't do it. Blurryness is not just an overlay of pixel-by-pixel. Blurryness actually interpolates pixels around a certain radius on a 2d flat area, so that can't be done with an image overlay. Sure you could make a blur effect in PS but that would be not dynamic. Changing little content would cause the blur to be wrong.
HelloMoon
by "blur" I mean the effect where things are getting un-sharp. sorry für my bad english. I mean: The opposite of sharp (when you need really big glasses but dont have them).
HelloMoon
+2  A: 

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.

rpetrich
sounds good. How would that offscreen buffer look like? What's that in theory? A CG graphics context?
HelloMoon
I'm afraid that 2 of the corners won't see much blur by this technique, or they get mixed but then it also looks pretty "dirty", since 2 corners will always have missing pixels. maybe with some scaling applied to the transform as well?
HelloMoon
I've replaced the contents of my answer with a method that is much better.
rpetrich
+1  A: 

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.

Matt Long
Thanks Matt, that's an interesting "antialiasing" effect. 0.5 is the best value to increase with. Unfortunately that blurryness is spread around 0.5 pixels, and not enough for a shining effect.
HelloMoon