Autolayout constraints and iPhone 6/6 plus

Question

I'm new to iOS development, and am having trouble with AutoLayout constraints. I'm trying to "pin" a label to the right side of a TableViewCell. It works fine in the iPhone 4s-5s simulators, but not in the iPhone 6 (plus) simulators.

The constraints on the label are top space to container margin, and leading space to container margin like this:

In the 4s/5/5s simulator it looks like I would expect it to, but the 6 plus simulator, I get this:

The same problem exists with the 6, but to a lesser degree.

If I swap out leading space to margin for trailing space to margin, the label falls off, leaving a blank cell in every simulator.

However, if I add the exact same layout constraints to a normal view, the label aligns fine. This is only occurring in the custom TableViewCell.

Both width and height are set to any in the size class. If I expand the width of the cell, move the label to the right, and then shrink the cell back so the label is off the side and then have the constraints adjusted, the label will at least get closer to the right on the 6+. The problem with this is that on anything smaller, it falls off the side.

How can I get the label to align to the right in all devices in the TableViewCell, or is this just a problem in the simulators? I don't exactly have a 6+ to test it on.

Answer 1

In your situation, to pin an object to the right hand side of a view, the only constraints you need are

• top space to container
• trailing space to container
• fixed width
• fixed height

If the width of your label is variable, you probably want to:

• right align the label
• remove the fixed width constraint and add either a lead space to container <= constraint or pin it to a sibling view that can change width.

If after changing the leading space to a trailing space constraint in your example you are seeing the labels disappear, I would make sure that your parent table view constraints are correct and that the tableview isnt bleeding out over the edge of the screen.

Answer 2

If I swap out leading space to margin for trailing space to margin, the label falls off, leaving a blank cell in every simulator

Not so. Remove the leading space constraint. Make a trailing space constraint from the right edge of the label to the right edge of the contentView - not to its margin, but the view itself. That's all you need.