Question

Twitter Bootstrap has a form control that would “glow” on the borders when in active mode, I wonder if that effect could be achieved on iPhone with UITextField. Has anyone tried that?

(http://twitter.github.com/bootstrap/base-css.html search Form Control)

Answer 1

Probably the easiest way to accomplish this is to modify its backing layer:

CALayer *theLayer = [theTextField layer];
[theLayer setBorderWidth:2.];
[theLayer setBorderColor:[[UIColor blueColor] CGColor]];
[theLayer setShadowColor:[[UIColor blueColor] CGColor]];
[theLayer setShadowOpacity:1.];
[theLayer setShadowRadius:5.];
[theLayer setShadowOffset:CGSizeZero];
[theTextField setClipsToBounds:NO];

The biggest disadvantage to this approach, IMO, is that CALayer shadow operations are notoriously slow, so this would be essentially unusable if you are animating (such as in a scroll/table view). There are various enhancements, though, that you can make for higher performance shadows.

(Also, you will obviously not want the ugly dark blue color that I used!)