UIBezierPath on UILabel in UITableViewCell has screwed up sizes

Question

I have this method for rounding corners inside of a subclass of UITableViewCell but whenever it is called it produces weird behavior that results in labels that are not correctly sized the first time around and then are correctly sized but with horrible borders the second time it is show:

-(UIView *)roundCornersOnView:(UIView *)view onTopLeft:(BOOL)tl topRight:(BOOL)tr bottomLeft:(BOOL)bl bottomRight:(BOOL)br radius:(float)radius WithBorder:(BOOL)showBorder
{

    if (tl || tr || bl || br) {
        UIRectCorner corner = 0; //holds the corner
        //Determine which corner(s) should be changed
        if (tl) {
            corner = corner | UIRectCornerTopLeft;
        }
        if (tr) {
            corner = corner | UIRectCornerTopRight;
        }
        if (bl) {
            corner = corner | UIRectCornerBottomLeft;
        }
        if (br) {
            corner = corner | UIRectCornerBottomRight;
        }

        UIView *roundedView = view;
        UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:roundedView.bounds byRoundingCorners:corner cornerRadii:CGSizeMake(radius, radius)];
        CAShapeLayer *maskLayer = [CAShapeLayer layer];
        maskLayer.frame = roundedView.bounds;
        maskLayer.path = maskPath.CGPath;
        roundedView.layer.mask = maskLayer;
        if(showBorder){
        CAShapeLayer *borderLayer = [[CAShapeLayer alloc] init];
            borderLayer.frame = roundedView.bounds;
            borderLayer.path  = maskPath.CGPath;
            borderLayer.lineWidth   = 4.0f;
            borderLayer.strokeColor = [UIColor whiteColor].CGColor;
            borderLayer.fillColor   = [UIColor clearColor].CGColor;
            [roundedView.layer addSublayer:borderLayer];
        }
        return roundedView;
    } else {
        return view;
    }

}

this is called in -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath as such below:

TimeOfDayCell * c = [tableView dequeueReusableCellWithIdentifier:@"weekdaySelectorOn"];

            c.day.text = [self.weekdays objectAtIndex:[self weekdayNormalizedIndexForIndexPath:indexPath]];
            c.day = (UILabel *)[c roundCornersOnView:c.day onTopLeft:YES topRight:YES bottomLeft:NO bottomRight:NO radius:12.0 WithBorder:NO];
            c.time1 = (UILabel *)[c roundCornersOnView:c.time1 onTopLeft:NO topRight:NO bottomLeft:YES bottomRight:YES radius:12.0 WithBorder:YES];
            c.time2 = (UILabel *)[c roundCornersOnView:c.time2 onTopLeft:NO topRight:NO bottomLeft:YES bottomRight:YES radius:12.0 WithBorder:YES];
            c.time3 = (UILabel *)[c roundCornersOnView:c.time3 onTopLeft:NO topRight:NO bottomLeft:YES bottomRight:YES radius:12.0 WithBorder:YES];

This yields the following weird output, the first picture being the first time the cell is shown, the second being when the cell is shown a second time:

Note: When if I don't call those methods they are sized just fine. — Erik, Aug 25 '15 at 16:43

score 11 · Accepted Answer · answered Aug 25 '15 at 17:23

So, it turns out not only did I need to put this in -(void)layoutSubviews I also needed to explicitly tell the contentView to layoutIfNeeded but even this was not enough, I had to also add setNeedsLayout

Full solution in UITableViewCell:

-(void)layoutSubviews
{
    [super layoutSubviews];
    [self.contentView setNeedsLayout];
    [self.contentView layoutIfNeeded];
    self.day = (UILabel *)[self roundCornersOnView:self.day onTopLeft:YES topRight:YES bottomLeft:NO bottomRight:NO radius:12.0 WithBorder:NO];
    self.time1 = (UILabel *)[self roundCornersOnView:self.time1 onTopLeft:NO topRight:NO bottomLeft:YES bottomRight:YES radius:12.0 WithBorder:YES];
    self.time2 = (UILabel *)[self roundCornersOnView:self.time2 onTopLeft:NO topRight:NO bottomLeft:YES bottomRight:YES radius:12.0 WithBorder:YES];
    self.time3 = (UILabel *)[self roundCornersOnView:self.time3 onTopLeft:NO topRight:NO bottomLeft:YES bottomRight:YES radius:12.0 WithBorder:YES];
}

was going crazy for an hour on this, thank you very much for this answer, worked like a charm — Josh O'Connor, Jan 25 '18 at 23:39

score 1 · Answer 2 · edited May 23 '17 at 12:14

1

It looks like the cell's frame is wrong the first time you are calling roundCornersOnView: First I would try moving this call to tableView:willDisplayCell:forRowAtIndexPath: If that doesn't work, you should look into making sure that maskLayer is getting its frame updated when the cell updates its frame. There's another SO question on that here.

edited May 23 '17 at 12:14

Community

1
1

answered Aug 25 '15 at 16:55

doctorBroctor

2,018
1
14
17

adding it in `tableView:willDisplayCell:forRowAtIndexPath:` yields the same results as well as overriding `layoutSubviews` in the cell – Erik Aug 25 '15 at 17:10
Using @Erik 's code in willDisplayCell worked for me........! – Saifan Nadaf Apr 25 '20 at 01:16

UIBezierPath on UILabel in UITableViewCell has screwed up sizes

2 Answers2