分组UITableView,iOS7圆角的解决方法

时间:2013-10-04 08:00:04

标签: ios uitableview ios7

自iOS7推出以来,Apple(confirmed here)删除了具有分组样式的UITableView单元格的圆角。尽管如此,我确信有聪明的人为此建立了解决方法。

请帮助我和许多其他iOS程序员,发布您的解决方法,以便在此线程中的iOS7中的UITableViewStyleGrouped 中获取单元格的圆角。非常感谢!

4 个答案:

答案 0 :(得分:14)

考虑到你的桌子中可以有多个组,一些单元格在顶角处进行四舍五入,另一些单元格在底部,而其他单元格则不是四舍五入。所以我使用以下方法在这里创建了UITableViewCell的子类(可以真正缩短):

你可以打电话给任何你想要的东西,我打电话给上下:

@property(nonatomic,assign) BOOL top,bottom;

实施:

- (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;
    }
}

在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
  }
}

要使用很简单,如果您的单元格是组中的第一个,请设置top = True,如果它是最后一个单元格bottom = true,如果该单元格是该组中的唯一单元格,则设置为true {{1}}。

如果您想要更多或更少的舍入,只需将无线电从10更改为另一个值。

答案 1 :(得分:4)

只需在代码中添加以下UITableView委托方法即可。对于iOS7中的Table视图,这对我来说真的很有帮助。请尝试以下代码taken from this answer by jvanmetre,也可以解决您的问题:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if ([cell respondsToSelector:@selector(tintColor)]) {
        if (tableView == tblProfileDetails) {    // self.tableview
            CGFloat cornerRadius = 5.f;
            cell.backgroundColor = UIColor.clearColor;
            CAShapeLayer *layer = [[CAShapeLayer alloc] init];
            CGMutablePathRef pathRef = CGPathCreateMutable();
            CGRect bounds = CGRectInset(cell.bounds, 5, 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)+5, bounds.size.height-lineHeight, bounds.size.width-5, 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;
        }
    }
}

答案 2 :(得分:3)

这是Roberto Ferraz稍微改进的答案。

它为您计算出顶部和底部单元格(假设单元格之间没有间隙)。

它还使用来自remove borders from group的技巧,适用于iOS7

@interface CustomTableViewCell : UITableViewCell

覆盖邮件:

#define radius 10

- (void)layoutSubviews {
    [super layoutSubviews];

    CGRect frame = self.frame;
    CGFloat top = frame.origin.y;
    CGFloat bottom = top + frame.size.height;
    UIRectCorner corners = UIRectCornerAllCorners;
    CAShapeLayer* mask = [CAShapeLayer layer];

    for (UIView* view in self.superview.subviews) {
        if (view.frame.origin.y + view.frame.size.height == top) {
            corners = corners & ~(UIRectCornerTopLeft|UIRectCornerTopRight);
        } else if (view.frame.origin.y == bottom) {
            corners = corners & ~(UIRectCornerBottomLeft|UIRectCornerBottomRight);
        }
    }

    mask.path = [UIBezierPath bezierPathWithRoundedRect:
                 CGRectMake(0, 0, frame.size.width, frame.size.height)
                                      byRoundingCorners:corners
                            cornerRadii:CGSizeMake(radius, radius)].CGPath;

    self.layer.mask = mask;
    self.layer.masksToBounds = YES;
}

/*
 iOS 7 workaround to get rid of top and bottom separators
*/
- (void) addSubview:(UIView*)view {
    if (view.frame.origin.x > 0 || view.frame.size.width < self.frame.size.width) {
        [super addSubview:view];
    }
}

答案 3 :(得分:-4)

您可以使用UIImageView并设置角半径,如下所示:

CALayer * l = [self.cellBackgroundImage layer];
[l setMasksToBounds:YES];
[l setCornerRadius:5.0];

要使用此功能,您应该导入quarts core:

#import <QuartzCore/QuartzCore.h>