UITableViewCell in ios7 now has gaps on left and right

Question

I have a UITableView where, in ios6, my custom cell stretched completely to the left and right sides of the screen. So my square image on the left of the cell was hard up against the phone screen.

However, now in ios7, there is a small gap appearing on the left hand side so the image is now away from the side and slightly overlaps my text within the cell.

This also seems to be happening in other apps I have that I am now viewing in ios7 - all have a gap on the left and perhaps the right as well.

My Custom cell is set to a size of 320 according to Interface Builder - ios 7 hasnt changed this has it?

score 23 · Answer 1 · answered Sep 27 '13 at 19:54

23

iOS7 added a separatorInset property.

Try adding this to your UITableViewController:

if ([self.tableView respondsToSelector:@selector(separatorInset)]) {
    [self.tableView setSeparatorInset:UIEdgeInsetsZero];
}

answered Sep 27 '13 at 19:54

loydbrahn

270
1
6

I have tried this without success. My table view is made with interface builder and I tried inserting your code into various places in the table view implementation without success (viewdidload, viewwillappear etc). I don't really want to get into subclassing if I can help it so am I missing something with regards to your method? – skeg0 Sep 28 '13 at 14:05
1

If you're using interface builder, then select the table view, go into the Attributes Inspector and find the selection under Table View labeled "Separator Insets", change the drop down from Default to Custom, then change the left value from 15 to 0. – loydbrahn Sep 29 '13 at 00:16
this appears to change the title for each section's insets but not within the table cell itself. – skeg0 Sep 30 '13 at 20:11
1

Not sure I understand... It should make the cell separator stretch all the way from left to right. If you're just setting the UITableViewCell's textLabel text property, then it will still have an indent. You can get rid of that by simply creating a new text label and adding it as a subview to the UITableViewCell's contentView. – loydbrahn Oct 02 '13 at 19:22
3

I have tried both solutions (using setSeparatorInset and Interface Builder's custom insets) and both does not seem to work for me in iOS 7 and iOS 8. The gap remains. – Lim Thye Chean Jul 05 '14 at 04:41
I can't get it to work either - I just hide the lines and draw them by making views with background colors and a height of 1 or 2 px – Lugubrious Aug 08 '14 at 22:17
The `separatorInset` doesn't seem to have any effect on the *default* position of the cell. The only way I found to remove the left gap was to override `layoutSubviews` in a custom `UITableViewCell` subclass as explained in [this answer](http://stackoverflow.com/a/19104028/172218) – j b Sep 30 '14 at 08:41

score 3 · Answer 2 · answered Oct 24 '13 at 13:25

I'd prefer to make seperators myself. It feels simpler than struggling with tableview settings.Just set seperators to none, subclass your cells and do this in init.

-(id)initWithCoder:(NSCoder *)aDecoder{
    self = [super initWithCoder:aDecoder];
    if(self){

        UIView *seperator = [[UIView alloc] init];
        [seperator setBackgroundColor:[UIColor blackColor]];
        seperator.frame = CGRectMake(0, self.bounds.size.height-1, self.bounds.size.width, 1);
        [seperator setAutoresizingMask:UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth];
        [self.contentView addSubview:seperator];

    }
    return self;
}

The problem is that on retina displays that separator will be 2px thick, whereas the UITableView drawn one will be still 1px thick. I went around this limitation by defining logic that discriminates between screen resolutions and draws either 0.5px or 1px line, but that's not future-proof at all. — user3099609, Jul 14 '14 at 10:47

score 3 · Answer 3 · edited Apr 13 '15 at 04:41

This is working perfect for me:

-(void)viewDidLayoutSubviews
{
    if ([self.Video_TableVIEW respondsToSelector:@selector(setSeparatorInset:)]) {
        [self.Video_TableVIEW setSeparatorInset:UIEdgeInsetsZero];
    }

    if ([self.Video_TableVIEW respondsToSelector:@selector(setLayoutMargins:)]) {
        [self.Video_TableVIEW setLayoutMargins:UIEdgeInsetsZero];
    }
}

-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if ([cell respondsToSelector:@selector(setSeparatorInset:)]) {
        [cell setSeparatorInset:UIEdgeInsetsZero];
    }

    if ([cell respondsToSelector:@selector(setLayoutMargins:)]) {
        [cell setLayoutMargins:UIEdgeInsetsZero];
    }
}

score 2 · Accepted Answer · answered Oct 06 '13 at 12:00

2

Adding the image to the cell.contentView fixes the problem:

[cell.contentView addSubview:imgView];

This way you don't even have to mind the separatorInset property.

answered Oct 06 '13 at 12:00

Tom

261
2
17

score 1 · Answer 5 · answered Oct 23 '13 at 16:38

1

For those using Xamarin/MonoTouch in c#

tableView.SeparatorInset = UIEdgeInsets.Zero;

answered Oct 23 '13 at 16:38

Webmonger

593
1
7
19

I'm not sure what that comment means but I believe the code I posted is correct as in Xamarin these properties are converted to Fields so it's easier to use. Documenetation can be found at http://docs.go-mono.com/monodoc.ashx?link=T%3aMonoTouch.UIKit.UIEdgeInsets%2f* – Webmonger Mar 06 '14 at 15:36
1

I think the above comment doesn't realise what mono is. `tableView.separatorInset = UIEdgeInsetsZero;` for obj-c `tableView.SeparatorInset = UIEdgeInsets.Zero;` for mono! – ingh.am Mar 07 '14 at 14:49

score 0 · Answer 6 · answered Jun 01 '16 at 05:39

0

 override func viewDidLoad() {
    super.viewDidLoad()

    tableView.cellLayoutMarginsFollowReadableWidth = false
 }

answered Jun 01 '16 at 05:39

harsh_v

3,193
3
34
53

UITableViewCell in ios7 now has gaps on left and right

6 Answers6

Linked