Skip to content

Instantly share code, notes, and snippets.

@TonnyXu
Created February 3, 2012 10:03
Show Gist options
  • Star 7 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save TonnyXu/1729463 to your computer and use it in GitHub Desktop.
Save TonnyXu/1729463 to your computer and use it in GitHub Desktop.
Make the UITableView with group style to round the image.

The point is, the roundCorner is draw by a subview of UITableViewCell, and mean while, it's not a public class, there is no way you can get layer.cornerRadius from any view. So we need to resolve this problem by ourselves.

There are 2 cases.

  1. There is only one cell.

    This case is ease, just use cell.contentView.layer.cornerRadius and cell.contentView.layer.masksToBounds to make it work.

  2. There are more than one cell.

    This case is a little bit difficult. We need to deal each cell separately. Use the cell.contentView.layer.mask property to make it work. The first cell and the last cell has different round corner position. So draw the path and make it work.

// Customize the number of sections in the table view.
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
return 1;
}
// Say we have 3 cells.
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return 3;
}
// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = @"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
}
// Configure the cell.
cell.textLabel.text = NSLocalizedString(@"Detail", @"Detail");
cell.imageView.image = [UIImage imageNamed:@"IMG_0143.JPG"];
return cell;
}
- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
// For cell only has one elment.
// cell.contentView.layer.cornerRadius = 8.f;
// cell.contentView.layer.masksToBounds = YES;
if (indexPath.row == 0) {
// first row
CGRect cellRect = cell.contentView.bounds;
CGMutablePathRef firstRowPath = CGPathCreateMutable();
CGPathMoveToPoint(firstRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMaxY(cellRect));
CGPathAddLineToPoint(firstRowPath, NULL, CGRectGetMinX(cellRect), 8.f);
CGPathAddArcToPoint(firstRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMinY(cellRect), 8.f, CGRectGetMinY(cellRect), 8.f);
CGPathAddLineToPoint(firstRowPath, NULL, CGRectGetMaxX(cellRect) - 8.f, 0.f);
CGPathAddArcToPoint(firstRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMinY(cellRect), CGRectGetMaxX(cellRect), 8.f, 8.f);
CGPathAddLineToPoint(firstRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMaxY(cellRect));
CGPathCloseSubpath(firstRowPath);
CAShapeLayer *newSharpLayer = [[CAShapeLayer alloc] init];
newSharpLayer.path = firstRowPath;
newSharpLayer.fillColor = [[UIColor whiteColor] colorWithAlphaComponent:1.f].CGColor;
CFRelease(firstRowPath);
cell.contentView.layer.mask = newSharpLayer;
// not necessary with ARC
//[newSharpLayer release];
}else if (indexPath.row == 2){
// last row
CGRect cellRect = cell.contentView.bounds;
CGMutablePathRef lastRowPath = CGPathCreateMutable();
CGPathMoveToPoint(lastRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMinY(cellRect));
CGPathAddLineToPoint(lastRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMinY(cellRect));
CGPathAddLineToPoint(lastRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMaxY(cellRect) - 8.f);
CGPathAddArcToPoint(lastRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMaxY(cellRect), CGRectGetMaxX(cellRect)- 8.f, CGRectGetMaxY(cellRect), 8.f);
CGPathAddLineToPoint(lastRowPath, NULL, 8.f, CGRectGetMaxY(cellRect));
CGPathAddArcToPoint(lastRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMaxY(cellRect), CGRectGetMinX(cellRect), CGRectGetMaxY(cellRect) - 8.f, 8.f);
CGPathCloseSubpath(lastRowPath);
CAShapeLayer *newSharpLayer = [[CAShapeLayer alloc] init];
newSharpLayer.path = lastRowPath;
newSharpLayer.fillColor = [[UIColor whiteColor] colorWithAlphaComponent:1.f].CGColor;
CFRelease(lastRowPath);
cell.contentView.layer.mask = newSharpLayer;
// not necessary with ARC
//[newSharpLayer release];
}
}
@JoshuaKaden
Copy link

This was extremely helpful to me. Many thanks!

@ElfSundae
Copy link

It works great, thanx! And I modified a little bit as below :)

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
        NSUInteger rowsCount = [self tableView:tableView numberOfRowsInSection:indexPath.section];
        if (1 == rowsCount) {
                cell.contentView.layer.cornerRadius = 8.f;
                cell.contentView.layer.masksToBounds = YES;
        } else {
                if (0 == indexPath.row) {
                        CGRect cellRect = cell.contentView.bounds;
                        CGMutablePathRef firstRowPath = CGPathCreateMutable();
                        CGPathMoveToPoint(firstRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMaxY(cellRect));
                        CGPathAddLineToPoint(firstRowPath, NULL, CGRectGetMinX(cellRect), 8.f);
                        CGPathAddArcToPoint(firstRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMinY(cellRect), 8.f, CGRectGetMinY(cellRect), 8.f);
                        CGPathAddLineToPoint(firstRowPath, NULL, CGRectGetMaxX(cellRect) - 8.f, 0.f);
                        CGPathAddArcToPoint(firstRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMinY(cellRect), CGRectGetMaxX(cellRect), 8.f, 8.f);
                        CGPathAddLineToPoint(firstRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMaxY(cellRect));
                        CGPathCloseSubpath(firstRowPath);

                        CAShapeLayer *newSharpLayer = [[CAShapeLayer alloc] init];
                        newSharpLayer.path = firstRowPath;
                        newSharpLayer.fillColor = [[UIColor whiteColor] colorWithAlphaComponent:1.f].CGColor;
                        CFRelease(firstRowPath);

                        cell.contentView.layer.mask = newSharpLayer;  
                } else if (indexPath.row == (rowsCount - 1)) {
                        CGRect cellRect = cell.contentView.bounds;
                        CGMutablePathRef lastRowPath = CGPathCreateMutable();
                        CGPathMoveToPoint(lastRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMinY(cellRect));
                        CGPathAddLineToPoint(lastRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMinY(cellRect));
                        CGPathAddLineToPoint(lastRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMaxY(cellRect) - 8.f);
                        CGPathAddArcToPoint(lastRowPath, NULL, CGRectGetMaxX(cellRect), CGRectGetMaxY(cellRect), CGRectGetMaxX(cellRect)- 8.f, CGRectGetMaxY(cellRect), 8.f);
                        CGPathAddLineToPoint(lastRowPath, NULL, 8.f, CGRectGetMaxY(cellRect));
                        CGPathAddArcToPoint(lastRowPath, NULL, CGRectGetMinX(cellRect), CGRectGetMaxY(cellRect), CGRectGetMinX(cellRect), CGRectGetMaxY(cellRect) - 8.f, 8.f);
                        CGPathCloseSubpath(lastRowPath);

                        CAShapeLayer *newSharpLayer = [[CAShapeLayer alloc] init];
                        newSharpLayer.path = lastRowPath;
                        newSharpLayer.fillColor = [[UIColor whiteColor] colorWithAlphaComponent:1.f].CGColor;
                        CFRelease(lastRowPath);

                        cell.contentView.layer.mask = newSharpLayer;
                }
        }
}

@kbabulrao
Copy link

kbabulrao commented Jun 22, 2016

not working in ios 9? any issue?

i made the table style as grouped. method also calling.

PFA

1111

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment