iOS开发之UITableviewCell实现两个圆角

坚持 成长 每日一篇

tableView时常有一个效果，就是当cell在section的第一个位置或者最后一行时，第一个cell左上角和右上角显示圆角，最后一个cell左下角和右下角显示圆角。

方法一

才用方法一可以实现圆角效果，但是如果table设置了滑动删除的话，第一行和最后一行滑动时候看不到删除按钮

如下面代码创建一个cell的子类

CornerTableViewCell.h

#import <UIKit/UIKit.h>
typedef NS_ENUM(NSInteger,RoundCornerType)
{
KKRoundCornerCellTypeTop,
KKRoundCornerCellTypeBottom,
KKRoundCornerCellTypeSingleRow,
KKRoundCornerCellTypeDefault
};
@interface CornerTableViewCell : UITableViewCell
{
CGFloat _cornerRadius;
}
@property(nonatomic,readwrite,assign)RoundCornerType roundCornerType;
-(id)initWithCornerRadius:(CGFloat)radius Style:(UITableViewCellStyle)tyle reuseIdentifier:(NSString*)identifier;
@end

CornerTableViewCell.m

#import "CornerTableViewCell.h"

@implementation CornerTableViewCell
-(id)initWithCornerRadius:(CGFloat)radius Style:(UITableViewCellStyle)tyle reuseIdentifier:(NSString*)identifier
{
self = [super initWithStyle:tyle reuseIdentifier:identifier];
if (self) {
_cornerRadius = radius;
}
return self;
}
-(void)setFrame:(CGRect)frame
{
[super setFrame:frame];
UIBezierPath *path;
switch (_roundCornerType) {
case KKRoundCornerCellTypeTop: {
path = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight cornerRadii:CGSizeMake(_cornerRadius, _cornerRadius)];
break;
}

case KKRoundCornerCellTypeBottom: {
path = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight cornerRadii:CGSizeMake(_cornerRadius, _cornerRadius)];
break;
}

case KKRoundCornerCellTypeSingleRow: {
path = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:UIRectCornerAllCorners cornerRadii:CGSizeMake(_cornerRadius, _cornerRadius)];
break;
}

case KKRoundCornerCellTypeDefault:
default: {
self.layer.mask = nil;
return;
}
}

CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.frame = self.bounds;
maskLayer.path = path.CGPath;
self.layer.mask = maskLayer;
}
@end

实现table的dataSource

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;
{
return 10;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *kCellID = @"CELLID";
CornerTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kCellID];
if (!cell) {
cell = [[CornerTableViewCell alloc] initWithCornerRadius:10.0f Style:UITableViewCellStyleDefault reuseIdentifier:kCellID];
}

if ([tableView numberOfRowsInSection:indexPath.section] == 1) {
cell.roundCornerType = KKRoundCornerCellTypeSingleRow;
} else if (indexPath.row == 0) {
cell.roundCornerType = KKRoundCornerCellTypeTop;
} else if (indexPath.row == [tableView numberOfRowsInSection:indexPath.section] - 1) {
cell.roundCornerType = KKRoundCornerCellTypeBottom;
} else {
cell.roundCornerType = KKRoundCornerCellTypeDefault;
}

cell.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 256.0
green:arc4random() % 256 / 256.0
blue:arc4random() % 256 / 256.0
alpha:1.0];
cell.textLabel.text = [NSString stringWithFormat:@"第%ld组第%ld行", indexPath.section + 1, indexPath.row + 1];

return cell;
}

方法二

方法二实现圆角没有方法一所说的问题，方法二通过给backGroudView添加mask来实现圆角效果

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
if ([cell respondsToSelector:@selector(tintColor)]) {
if (tableView == self.tableView) {
CGFloat cornerRadius = 5.f;
cell.backgroundColor = UIColor.clearColor;
CAShapeLayer *layer = [[CAShapeLayer alloc] init];
CGMutablePathRef pathRef = CGPathCreateMutable();
CGRect bounds = CGRectInset(cell.bounds, 10, 0);
BOOL addLine = NO;
if (indexPath.row == 0 && indexPath.row == [tableView numberOfRowsInSection:indexPath.section]-1) {
CGPathAddRoundedRect(pathRef, nil, bounds, cornerRadius, cornerRadius);
} else if (indexPath.row == 0) {
CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds));
CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds), CGRectGetMidX(bounds), CGRectGetMinY(bounds), cornerRadius);
CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius);
CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds));
addLine = YES;
} else if (indexPath.row == [tableView numberOfRowsInSection:indexPath.section]-1) {
CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds));
CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds), CGRectGetMidX(bounds), CGRectGetMaxY(bounds), cornerRadius);
CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius);
CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds));
} else {
CGPathAddRect(pathRef, nil, bounds);
addLine = YES;
}
layer.path = pathRef;
CFRelease(pathRef);
layer.fillColor = [UIColor colorWithWhite:1.f alpha:0.8f].CGColor;

if (addLine == YES) {
CALayer *lineLayer = [[CALayer alloc] init];
CGFloat lineHeight = (1.f / [UIScreen mainScreen].scale);
lineLayer.frame = CGRectMake(CGRectGetMinX(bounds)+10, bounds.size.height-lineHeight, bounds.size.width-10, lineHeight);
lineLayer.backgroundColor = tableView.separatorColor.CGColor;
[layer addSublayer:lineLayer];
}
UIView *testView = [[UIView alloc] initWithFrame:bounds];
[testView.layer insertSublayer:layer atIndex:0];
testView.backgroundColor = UIColor.clearColor;
cell.backgroundView = testView;
}
}
}