Create custom UITableView separator line

Claus picture Claus · Jun 28, 2013 · Viewed 12.8k times · Source

I would like to create a separator line like this one:

enter image description here

Any idea about how to implement it? I tried getting an image of the line and using UIAppearance proxy objects:

[[UITableView appearanceWhenContainedIn:[MyController class], nil] setSeparatorColor:
[UIColor colorWithPatternImage:[UIImage imageNamed:@"line.png"]]];
[[UITableView appearanceWhenContainedIn:[MyController class], nil] setSeparatorStyle:UITableViewCellSeparatorStyleSingleLine];

but,somehow, only the black line gets rendered.

Answer

Tarek Hallak picture Tarek Hallak · Jun 28, 2013

you can try below:

UIView *separator = [[UIView alloc] initWithFrame:CGRectMake(0, cell.contentView.frame.size.height - 1.0, cell.contentView.frame.size.width, 1)];
separator.backgroundColor = myColor;
[cell.contentView addSubview:separator];

or

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
   UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"separator.png"]];
   imageView.frame = CGRectMake(0, 100, 320, 1);
   [customCell.contentView addSubview:imageView];

   return customCell;
}