How do I create a round cornered UILabel on the iPhone?

Question

Is there a built in way to create round-cornered UILabels? If the answer is no, how would one go about creating such an object?

Answer 1

Before 3.0

One way to do it, which I used recently, is to create a UIView subclass which simply draws a rounded rectangle, and then make the UILabel or, in my case, UITextView, a subview inside of it. Specifically:

1. Create a UIView subclass and name it something like RoundRectView.
2. In RoundRectView's drawRect: method, draw a path around the bounds of the view using Core Graphics calls like CGContextAddLineToPoint() for the edges and and CGContextAddArcToPoint() for the rounded corners.
3. Create a UILabel instance and make it a subview of the RoundRectView.
4. Set the frame of the label to be a few pixels inset of the RoundRectView's bounds. (For example, label.frame = CGRectInset(roundRectView.bounds, 8, 8);)

You can place the RoundRectView on a view using Interface Builder if you create a generic UIView and then change its class using the inspector. You won't see the rectangle until you compile and run your app, but at least you'll be able to place the subview and connect it to outlets or actions if needed.

3.0 and Later

iPhone OS 3.0 and later supports the cornerRadius property on the CALayer class. Every view has a CALayer instance that you can manipulate. This means you can get rounded corners in one line now:

view.layer.cornerRadius = 8;

You will need to #import <QuartzCore/QuartzCore.h> and link to the QuartzCore framework to get access to CALayer's headers and properties.

Answer 2

Another method is to place a png behind the UILabel. I have views with several labels that overlay a single background png that has all the artwork for the individual labels.

Answer 3

Did you try using the UIButton from the Interface builder (that has rounded corners ) and experimenting with the settings to make it look like a label.. if all you want is to display static text within.

Answer 4

There's similar question with example code for rounded corners.