Instantly share code, notes, and snippets.

Embed
What would you like to do?
Customizable background view for UITableViewCell in grouped table view
//
// CellBackgroundView.h
//
//
#import <UIKit/UIKit.h>
typedef enum {
CellPositionTop,
CellPositionMiddle,
CellPositionBottom,
CellPositionSingle
} CellPosition;
@interface CellBackgroundView : UIView
@property(assign) CellPosition position;
@property(strong) UIColor *fillColor;
@property(strong) UIColor *borderColor;
@end
//
// CellBackgroundView.m
//
//
#import "CellBackgroundView.h"
static const CGFloat kCornerRadius = 10;
@implementation CellBackgroundView
@synthesize position, fillColor, borderColor;
- (void)drawRect:(CGRect)rect
{
CGRect bounds = CGRectInset(self.bounds,
0.5 / [UIScreen mainScreen].scale,
0.5 / [UIScreen mainScreen].scale);
UIBezierPath *path;
if (position == CellPositionSingle) {
path = [UIBezierPath bezierPathWithRoundedRect:bounds cornerRadius:kCornerRadius];
} else if (position == CellPositionTop) {
bounds.size.height += 1;
path = [UIBezierPath bezierPathWithRoundedRect:bounds
byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight
cornerRadii:CGSizeMake(kCornerRadius, kCornerRadius)];
} else if (position == CellPositionBottom) {
path = [UIBezierPath bezierPathWithRoundedRect:bounds
byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight
cornerRadii:CGSizeMake(kCornerRadius, kCornerRadius)];
} else {
bounds.size.height += 1;
path = [UIBezierPath bezierPathWithRect:bounds];
}
[self.fillColor setFill];
[self.borderColor setStroke];
[path fill];
[path stroke];
}
@end
@vgrichina

This comment has been minimized.

Owner

vgrichina commented Nov 12, 2012

Sample usage:

CellBackgroundView *backgroundView = [CellBackgroundView new];
cell.backgroundView = backgroundView;
backgroundView.backgroundColor = [UIColor clearColor];
backgroundView.borderColor = self.tableView.separatorColor;
backgroundView.fillColor = [UIColor colorWithWhite:137/255. alpha:1.0];

int rowsInSection = [self tableView:tableView numberOfRowsInSection:indexPath.section];
if (rowsInSection == 1) {
    backgroundView.position = CellPositingSingle;
} else {
    if (indexPath.row == 0) {
        backgroundView.position = CellPositionTop;
    } else if (indexPath.row == rowsInSection - 1) {
        backgroundView.position = CellPositionBottom;
    } else {
        backgroundView.position = CellPositionMiddle;
    }
}
@vgrichina

This comment has been minimized.

Owner

vgrichina commented Nov 13, 2012

Comment above has typo CellPositingSingle should be CellPositionSingle

@francesctovar

This comment has been minimized.

francesctovar commented Jun 2, 2013

Nice!

@rolandjitsu

This comment has been minimized.

rolandjitsu commented Dec 20, 2013

There is one thing missing though: [path addClip];. Sometimes you may get a black background under the corner radius, I tired a lot of things before I discovered that doing the just mentioned fixes it. I could not find an explanation why though :| And with latest XCode, there is no need to @synthesize anymore, the compiler does that for you runtime.

@Performat

This comment has been minimized.

Performat commented Mar 27, 2015

Still very useful today. Thanks a lot!

@susmita-fueled

This comment has been minimized.

susmita-fueled commented Jun 24, 2016

Thanks! This is very useful.

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