Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I add an extra separator to the top of a UITableView?

I have a view for the iPhone that is basically split in two, with an informational display in the top half, and a UITableView for selecting actions in the bottom half. The problem is that there is no border or separator above the first cell in the UITableView, so the first item in the list looks funny. How can I add an extra separator at the top of the table, to separate it from the display area above it?

Here's the code to build the cells - it's pretty straightforward. The overall layout is handled in a xib.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {     static NSString *CellIdentifier = @"Cell";      UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];     if (cell == nil) {         cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];         cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;     }      switch(indexPath.row) {         case 0: {             cell.textLabel.text = @"Action 1";             break;         }         case 1: {             cell.textLabel.text = @"Action 2";             break;         }         // etc.......     }     return cell; } 
like image 681
richt Avatar asked Jun 10 '10 06:06

richt


People also ask

How do I populate Uitableview?

There are two main base ways to populate a tableview. The more popular is through Interface Building, using a prototype cell UI object. The other is strictly through code when you don't need a prototype cell from Interface Builder.

What is IndexPath in Tableview Swift?

Swift version: 5.6. Index paths describe an item's position inside a table view or collection view, storing both its section and its position inside that section.


2 Answers

To replicate the standard iOS separator lines, I use a 1 px (not 1 pt) hair line tableHeaderView with the table view's separatorColor:

// in -viewDidLoad self.tableView.tableHeaderView = ({     UIView *line = [[UIView alloc]                      initWithFrame:CGRectMake(0, 0,                     self.tableView.frame.size.width, 1 / UIScreen.mainScreen.scale)];     line.backgroundColor = self.tableView.separatorColor;     line; }); 

The same in Swift (thanks, Dane Jordan, Yuichi Kato, Tony Merritt):

let px = 1 / UIScreen.main.scale let frame = CGRect(x: 0, y: 0, width: self.tableView.frame.size.width, height: px) let line = UIView(frame: frame) self.tableView.tableHeaderView = line line.backgroundColor = self.tableView.separatorColor 
like image 181
Ortwin Gentz Avatar answered Sep 21 '22 05:09

Ortwin Gentz


I just got hit with this same problem and realised that the separator at the top is only displayed whilst scrolling the table.

What I then did was the following

  1. In Interface Builder go to "Scroll View Size"
  2. Set the Content Insets of Top to 1

Alternatively in code you could do

[tableView setContentInset:UIEdgeInsetsMake(1.0, 0.0, 0.0, 0.0)]; 

NOTE: This no longer works for iOS7 as the separators are no longer shown at all.

like image 34
Jason Avatar answered Sep 23 '22 05:09

Jason