Rounded Rectangles around your UIView objects

I've convinced someone to pay me to learn how to write iPhone applications and to then produce an iPhone application for them. Something that isn't answered very well is how to make your views have rounded rectangle borders (like the rounded rectangle UIButton).
There are a few ways to do this:
  • Use a background image... self explanatory, not very flexible, kind of ... ewww.
  • Override the draw method on a custom view... outside of what I want to explain in this blog post (quick blog post while I'm burning cycles on another problem). Suboptimal, requires subclassing common views to get rounded rectangle behavior on them (UITableView, UITextView, UILabel..), that is not worth the effort.
  • Quartz 2d CALayer properties!!!! Ring the bell, this one wins.
#import "TestCustomView.h"
//need to include this puts CALayer property on any view object.
#import <QuartzCore/QuartzCore.h>

@implementation TestCustomView

@synthesize gradeTable = m_gradeTable;

- (id)initWithFrame:(CGRect)frame {
if ((self = [super initWithFrame:frame])) {
// Initialization code
}
return self;
}

-(void)layoutSubviews{
[super layoutSubviews];

//THIS IS THE MAGIC. puts a rounded rect border around your tableview.
self.gradeTable.layer.cornerRadius = 10;
self.gradeTable.layer.borderColor = [[UIColor darkGrayColor] CGColor];
self.gradeTable.layer.borderWidth = .5;
}

- (void)dealloc {
[m_gradeTable release];
[super dealloc];
}
@end

Comments