Matching left alignment of custom & standard UITableViewCell types

Question

I\'m defining custom UITableViewCells in a storyboard. I\'m also using some of the built in standard style cells. I need to set up constraints so that my

Answer 1

I was having the same issue but the other answer couldn't help me as I was using static cells in UITableViewController. After a few trial-and-errors, I finally found a way to solve the separatorInset issue on iPhone 6+ without a single line of code.

I simply align the left edge of the UILabel with value of 0 [Content View (current distance = 0)] from the left margin. And also change the UILabel's X position to get 0. (For my case, in Interface Builder, margin was 7, UILabel's X = 8). The alignment works well on iPhone 4S, 5S, 6 and 6+.

EDIT: This changed in XCode 7. Additional step: Set "Preserve Superview Margins" of the respective cell's TableViewCell and its contentView to TRUE or check it in IB -> Size Inspector. Refer to @tebs1200's answer.

Hope this helps.

Answer 2

You can implement the solution suggested by Mark purely in the storyboard:

1. Make sure the custom cell is selected.

2. Make sure Preserve Superview Margins is selected in the Size inspector

3. Now select the cell's Content View

4. Make sure Preserve Superview Margins is selected here too (see image in step 2.)

5. Select the label (or other view) in your custom prototype cell.

6. Constrain it's left edge 0 pixels from the margin.

Answer 3

In iOS8 Apple introduced layoutMargins

You can set it in your storyboard or on your code simply like this :

cell.layoutMargins = UIEdgeInsetsZero // change by your custom value

Before that, you must set preservesSuperviewLayoutMargins to NO to prevent the cell from inheriting the Table View's margin settings

preservesSuperviewLayoutMargins : A Boolean value indicating whether the current view also respects the margins of its superview.

Hope this can help you ;)

Answer 4

What worked for me was adding these 2 lines to my custom UITableViewCell implementation:

self.preservesSuperviewLayoutMargins = YES;
self.contentView.preservesSuperviewLayoutMargins = YES;
// ... add test view to content view...

Then I used Auto Layout with the default spacing:

[self.contentView addConstraints:[NSLayoutConstraint 
  constraintsWithVisualFormat:@"H:|-[testView]-|" options:0 metrics:nil 
   views:@{@"testView":testLabel}]];

[self.contentView addConstraints:[NSLayoutConstraint 
  constraintsWithVisualFormat:@"V:|-[testView]-|" options:0 metrics:nil 
   views:@{@"testView":testLabel}]];

Answer 5

This is years later and I didn't have any luck with the solutions above. I found that setting the leading constraint (in the storyboard) to 16 generally and 20 for height size class .compact works well for iOS 13 on various devices. However, for older iOS versions I ended up wiring that constraint to the custom cell's class and adding this:

    @IBOutlet var stackViewLeadingConstraint: NSLayoutConstraint!


    override func layoutSubviews() {
        super.layoutSubviews()
        guard #available(iOS 13, *)
            else {
                if traitCollection.verticalSizeClass == .compact {
                    stackViewLeadingConstraint.constant = 16
                }
                return
        }
    }

UPDATE: I got nervous about how fragile this approach might be. For my current situation I realized I can use a variety of system tableView cells to satisfy the requirements without mixing in custom cells. That seems to solve the alignment issues.