iOS UITableView Cell Indentation

Question

I am setting up a UITableView programmatically. I would like the content of the cell to span the entire width of the screen. I have successfully set the cell to span the width of the screen, but the content and separators are still inset significantly (iPad screenshot below).

Here is the tableview layout setup in my view controller implementation:

- (void) viewDidLoad {
    [super viewDidLoad];

    // table layout
    self.tableView.rowHeight = 192;
    UILayoutGuide *margins = [self.view layoutMarginsGuide];
    [self.tableView.leadingAnchor constraintEqualToAnchor:margins.leadingAnchor] ;
    [self.tableView.trailingAnchor constraintEqualToAnchor:margins.trailingAnchor];
    self.tableView.contentInset = UIEdgeInsetsMake(0, 0, 0, 0);

    CGRect tableRect = self.view.frame;
    self.tableView.frame = tableRect;

    // table colors
    self.tableView.backgroundColor = [UIColor grayColor];
    self.tableView.separatorColor = [UIColor grayColor];
    UIView *backView = [[UIView alloc] init];
    [backView setBackgroundColor:[UIColor grayColor]];
    [self.tableView setBackgroundView:backView];
}

Then I set the cell's content:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell* cell = [super tableView:tableView cellForRowAtIndexPath:indexPath];
    cell.backgroundColor = [UIColor blueColor];
    cell.indentationWidth = 0;
    cell.indentationLevel = 0;
    cell.layoutMargins = UIEdgeInsetsMake(0, 0, 0, 0);
    cell.contentView.backgroundColor = [UIColor purpleColor];
    return cell;
}

The cell background is blue, and it spans the width of the screen. The purple area in my screenshot is the contentView, and as you can see, it doesn't stretch to the right edge of the screen, and the cell text is inset at the left. The separator is also inset at left and right.

table screenshot

Follow my answer , this may help to solve your issue : http://stackoverflow.com/questions/34959397/how-do-i-make-the-uitableview-separator-inset-go-from-the-edges-of-the-screen/34959765#34959765 — technerd, Jan 29 '16 at 18:00
Thank you @technerd! Your answer helped me identify what I was missing. I will post the details in an answer below. — turnerjess, Jan 29 '16 at 18:33
If you find my answer helpful, then please upvote it. Thanks — technerd, Jan 29 '16 at 18:36

score 4 · Answer 1 · answered Jan 29 '16 at 18:42

I discovered the issue thanks to the comment on my question by @technerd. Thank you!

I was testing my app on iOS 9.2, and I neglected to account for the new iOS9+ cell property cellLayoutMarginsFollowReadableWidth, which adjusts the cell layout by default.

To turn the auto-resizing off, you'll need to check the iOS version and then disable the property, as @technerd demonstrates:

Objective C

- (void)viewDidLoad {
    [super viewDidLoad];

    //For iOS 9 and Above 

    if ([[[UIDevice currentDevice]systemVersion]floatValue] >= 9.0) {
        self.tableView.cellLayoutMarginsFollowReadableWidth = NO;
    }
}

Swift

override func viewDidLoad() {
    super.viewDidLoad()

    //For iOS 9 and Above 
    if #available(iOS 9, *) {
        tableView.cellLayoutMarginsFollowReadableWidth = false
    }
}

Hope this helps others.

score 2 · Answer 2 · answered Jul 15 '19 at 10:47

2

The above solution doesn't really work perfectly anymore. Although, all you need to do now is:

tableView.separatorInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)

This will make your separator run throughout the width of the table view.

answered Jul 15 '19 at 10:47

danialzahid94

4,103
2
19
31

Perfect!! Thanks. – PhillipJacobs Apr 17 '20 at 12:02

iOS UITableView Cell Indentation

2 Answers2