Dividing Cells in a UITableView - ios

Question

I am attempting to obtain this result to get a TitleTextLabel|DescTextLabel with the line to break the two. Just like this example the homepage is divided from the URL field.
Can someone please point me in the right direction? I have read online / & the documentation but cannot find the right answer I'm looking for. I appreciate your help!
Thanks

Answer 1

There are a couple of ways I can think of to add that dividing line. You could override drawRect, and draw the line there. Another way that could be done wholly in IB, would be to add a 1 pixel wide label (with a light gray background an no text) in between the left and right labels. The left label should have a fixed width and constraints to the left side of the cell and to the 1 pixel wide label. The right label should just have constraints to the 1 pixel wide label and the right side of the cell (no fixed width). The 1 pixel wide label should have 0 length constraints to the top and bottom of the cell and a fixed width.

Answer 2

You need to draw that line on the cell manually.
1) Create UIView subclass called CellDividerView Override the -drawRect: method in the UIView subclass CellDividerView.m. The drawing code fills the entire rect with a solid color, dark gray in this case.
- (void)drawRect:(CGRect)rect
{
CGContextRef currentContext = UIGraphicsGetCurrentContext();
CGContextSaveGState(currentContext);
CGContextSetFillColorWithColor(currentContext, [UIColor lightGrayColor].CGColor);
CGContextFillRect(currentContext, rect);
CGContextRestoreGState(currentContext);
}
In the table view delegate's -tableView:cellForRowAtIndexPath: you create and init a CellDividerView with the frame positioned where you want it on the cell. In the code below it is positioned 40pts to the right, 0pts from the top, and it is 1pt wide and spans the entire cell height vertically. Next, this view is added to the cell's contentView.
#define CELL_VIEW_TAG 1234
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];
cell.detailTextLabel.text = [NSString stringWithFormat:#"Section %u", indexPath.section];
cell.textLabel.text = [NSString stringWithFormat:#"Row %u", indexPath.row];
// Configure the cell...
CellView *cellView = (CellView *)[cell.contentView viewWithTag:CELL_VIEW_TAG];
if (!cellView)
{
cellView = [[CellView alloc] initWithFrame:CGRectMake(40.0, 0.0, 1.0, cell.contentView.frame.size.height)];
[cell.contentView addSubview:cellView];
cellView.tag = CELL_VIEW_TAG;
}
return cell;
}
The result is something like this:
Using a custom cell style and adjusting the 40.0pt offset will allow you to accurately position the line where you want it.

Answer 3

It doesn't have the line dividing it by default, but try UITableViewCellStyleValue2