Reproducing a tableView like in Stocks/Spotlight/Weather

by Hans Pinckaers

This article is outdated. You can find the better optimized tableView here: http://www.hanspinckaers.com/high-performance-rounded-corner-uitableview

To come straight out with it: the trick is

view.layer.cornerRadius = 10;


For this to work you need to include the QuartzCore into the class which you call that property:

#import <QuartzCore/QuartzCore.h>

I heard that this only works since OS 3.0. Haven’t checked it though.

This is the idea:
Scrollview (rounded corners) -> TableView (rounded corners, scrolling disabled)

Don’t use this with big tables because it will ruin the cache system of the table. I will post a solution and better method next week.

This is the code:

self.view = [[UIView alloc] init];
 
scrollView = [[UIScrollView alloc] init];
scrollView.frame = CGRectMake(10, 40, 300, 380);
scrollView.layer.cornerRadius = 15;
[self.view addSubview:scrollView];
[scrollView setShowsVerticalScrollIndicator:NO];
 
table = [[RoundedCornerTableViewController alloc] initWithStyle:UITableViewStylePlain];
table.tableView.scrollEnabled = NO;
table.tableView.layer.cornerRadius = 15;
 
//Should be set the same as
[scrollView setContentSize:CGSizeMake(300, 800)];
table.tableView.frame = CGRectMake(0, 0, 300, 800);
[scrollView addSubview:table.tableView];

Download the sample project

Here.