CODEWITHSUNDEEP
iosuitableview
Jean Lebrument
Jean Lebrument

Reputation: 5169

Draw dotted border bottom for UITableViewCell

I would like add an dotted bottom border to my UITableViewCell.

Currently, I am using the following code,

    CAShapeLayer *border = [CAShapeLayer layer];
    border.strokeColor = [UIColor colorWithRed:67/255.0f green:37/255.0f blue:83/255.0f alpha:1].CGColor;
    border.fillColor = nil;
    border.lineDashPattern = @[@1, @1];
    border.path = [UIBezierPath bezierPathWithRect:cell.bounds].CGPath;
    border.frame = CGRectMake(cell.bounds.origin.x, cell.bounds.origin.y + cell.bounds.size.height, cell.bounds.size.width, 1);
    [cell.layer addSublayer:border];

With this code I have a dotted border bottom for my cell but the height of the dotted border is two time too big.

But I'm not very good to manipulate CAShapeLayer and I didn't find anything to help me.

Thanks !

Upvotes: 4

Views: 2697

Answers (2)

Cyrille
Cyrille

Reputation: 25144

If it's the stroke that's too wide, try changing your layer's lineWidth. Something like this will do the trick:

border.lineWidth = 1. / [[UIScreen mainScreen] scale];

That'll draw a 1px line on non-Retina devices, and a 1px line (0.5pt) on Retina ones, resulting in an ultra-crisp line.

Also, you could build your path with just a single line instead of a rect using moveToPoint and addLineToPoint on a UIBezierPath:

UIBezierPath *bPath = [UIBezierPath new];
[bPath moveToPoint:CGPointZero];
[bPath addLineToPoint:(CGPoint){100, 0}];
border.path = bPath.CGPath;

Adjust as needed.

Upvotes: 4

Mitul Bhadeshiya
Mitul Bhadeshiya

Reputation: 1358

create custom cell and set your border to bottom of custom cell 

/* drow line bottom */
cell.layer.shadowColor = [UIColor colorWithRed:67/255.0f green:37/255.0f blue:83/255.0f alpha:1].CGColor;
cell.layer.shadowOpacity = 1.0;
cell.layer.shadowRadius = 0;
cell.layer.shadowOffset = CGSizeMake(0.0, 1.0);

or..

other wise check the bellow link they give answer to set cell bellow image UITableView Cells separated by dotted lines

Upvotes: 0

Related Questions