Since the introduction of iOS7, rounded corners for the cells of UITableView with grouped style is removed by Apple (confirmed here). Still, I am sure there are smart people out there who have built workarounds for this.
Please, to help me and a lot of other fellow iOS programmers, post your workarounds to get rounded corners for the cells in a UITableViewStyleGrouped in iOS7 in this thread. It will be much appreciated!
Considering you can have multiple groups in your table, some cells are rounding in just in the top corners, other just in the bottom, and others are not rounded. So I created here really fast a subclass (that can be really shortened) of UITableViewCell with the following methods:
A property that you can call anything you want, I called top and bottom:
@property(nonatomic,assign) BOOL top,bottom;
The implementation:
- (void)layoutSubviews
{
[super layoutSubviews];
if(self.top && self.bottom)
{
self.layer.cornerRadius = 10;
self.layer.masksToBounds = YES;
return;
}
if (self.top)
{
CAShapeLayer *shape = [[CAShapeLayer alloc] init];
shape.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height) byRoundingCorners:UIRectCornerTopLeft|UIRectCornerTopRight cornerRadii:CGSizeMake(10, 10)].CGPath;
self.layer.mask = shape;
self.layer.masksToBounds = YES;
return;
}
if (self.bottom)
{
CAShapeLayer *shape = [[CAShapeLayer alloc] init];
shape.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height) byRoundingCorners:UIRectCornerBottomLeft|UIRectCornerBottomRight cornerRadii:CGSizeMake(10, 10)].CGPath;
self.layer.mask = shape;
self.layer.masksToBounds = YES;
}
}
In Swift 4.2:
class MyCell: UITableViewCell {
var top = false
var bottom = false
override func layoutSubviews() {
super.layoutSubviews()
if top && bottom {
layer.cornerRadius = 10
layer.masksToBounds = true
return
}
let shape = CAShapeLayer()
let rect = CGRect(x: 0, y: 0, width: bounds.width, height: bounds.size.height)
let corners: UIRectCorner = self.top ? [.topLeft, .topRight] : [.bottomRight, .bottomLeft]
shape.path = UIBezierPath(roundedRect: rect, byRoundingCorners: corners, cornerRadii: CGSize(width: 10, height: 10)).cgPath
layer.mask = shape
layer.masksToBounds = true
}
}
To use is simple, if your cell is the first of a group, set top = True
, if it is the last cell, bottom = true
, if the cell is the only on the group set both to true
.
If you want more or less rounded, just change the radios from 10 to another value.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With