2

I have a UITableViewCell with three labels on it. Two along the top and one that holds some content along the bottom. I constrain the two top labels so that they are 8pts from the top of the view. The left label is 8pts from the leading edge and the right label is 8pts from the trailing edge. I then set the left label to be 12pts minimum from the right label.

Title constraints

View in Xcode: Title constraints

Date constraints

View in Xcode: Date constraints

It looks fine in Xcode when I evaluate it. I can add a really long title (left topmost label) and it truncates the text correctly, giving me my 12pt margin to the date label.

When I run the app at runtime, the constraints don't seem to be applied. The title label is the full width of the device with the date label no where to be seen.

iPhone 5 Simulator

It does this on the iPhone 5, 5s, 6 and 6 Plus simulators. What am I doing wrong? In my viewDidLoad() method, I am loading the nib containing the UITableViewCell and then registering it. I also add a button to the UINavigationController.

override func viewDidLoad() {
    super.viewDidLoad()

    // Do any additional setup after loading the view, typically from a nib.
    self.navigationItem.leftBarButtonItem = self.editButtonItem()
    if let split = self.splitViewController {
        let controllers = split.viewControllers
        self.detailViewController = controllers[controllers.count-1].topViewController as? DetailViewController
    }

    // Register our additional nibs
    let nibName = UINib(nibName: "StandardNoteCell", bundle: nil)
    tableView.registerNib(nibName, forCellReuseIdentifier: identifier)

    self.newNoteButton = self.createNewRoundButton()
    self.navigationController?.view.addSubview(self.newNoteButton)
}

Does anything stand out as being incorrect?

Paulw11
  • 108,386
  • 14
  • 159
  • 186
Johnathon Sullinger
  • 7,097
  • 5
  • 37
  • 102
  • It doesn't look fine to me - see those red and orange outlines. They are telling you that you have issues with your constraints. You don't have a width constraint for either of your items - you need at least one – Paulw11 Jun 11 '15 at 02:52
  • How can I tell what those issues are? I do an Update Frames and Update Constraints from within Xcode, which doesn't seem to make any difference – Johnathon Sullinger Jun 11 '15 at 02:53
  • If you look in the storyboard navigator you will see a red arrow next to the scene name - click this to see the issues – Paulw11 Jun 11 '15 at 02:54

3 Answers3

2

The problem is that you have two text labels with ambiguous information about how to resolve the case in which they can't both fully fit in the horizontal space available.

To resolve, set the date label's compression resistance to "1000 (Required)". This way the date will always be visible no matter what, and the other views (the title label, in this case) will work around that by shrinking.

As an experiment, try setting both labels' compression resistance to 1000. This will be impossible to achieve, and you'll see errors in your console. So use required constraints sparingly - you want your constraints to be as flexible as possible.

Aaron Brager
  • 65,323
  • 19
  • 161
  • 287
  • Thanks, I think in this case the only required constraint in the view would be the date. Since the title is set to 1 line, I shouldn't have this issue with the content below it. – Johnathon Sullinger Jun 11 '15 at 03:08
  • Is there any reason in particular to set the Date compression resistance to 1000, as opposed to setting the title compression to less than the dates? This seemed to work, curious why 1,000 is preferred. – Johnathon Sullinger Jun 11 '15 at 03:10
  • @JohnathonSullinger Either is fine on a technical level. Personally, I find it easier to figure out constraints in my head when I can assume certain things are given. – Aaron Brager Jun 11 '15 at 03:13
  • 1
    @JohnathonSullinger it does not have to be 1,000 it just have to be greater than the others, however apple suggest to developers to use those values – Icaro Jun 11 '15 at 03:13
  • Thanks guys, I will stick with 1,000 on the date label then. – Johnathon Sullinger Jun 11 '15 at 03:13
1

XCode does not know the size of UILabel, you can see your constrains are all red in the horizontal axis. There is two solutions for your problem

  1. Set the width of the labels
  2. Set the hugging/Compression of the label

If you set the width the label won't resize depending on the size of the screen. If you set the hugging it will expand/contract depending on the priority of each UITextField

Content Hugging: Don't want to grow

Content Compression Resistance: Don't want to shrink

enter image description here

Icaro
  • 14,585
  • 6
  • 60
  • 75
  • Thanks, I'm looking up how to do hugging now. I'm new to Auto-layout, last time I did iOS dev was obj-c & iOS 4 – Johnathon Sullinger Jun 11 '15 at 02:55
  • After googling and finding [a stackoverflow post](http://stackoverflow.com/a/16281229/1815321) on compression vs hugging, i was able to resolve my issue be lowering the compression on the `Title` label. – Johnathon Sullinger Jun 11 '15 at 03:00
  • 1
    This answer contains some incorrect information. UILabels have an [`intrinsicContentSize`](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIView_Class/index.html#//apple_ref/occ/instm/UIView/intrinsicContentSize). It is not required to set size constraints unless you want to override the default value. – Aaron Brager Jun 11 '15 at 03:01
  • The intrinsic size on my labels is set to the Default. Should that be changed? – Johnathon Sullinger Jun 11 '15 at 03:01
  • The intrinsic content size is what you want if you want all of the text to display. (You might set a maximum height constraint, for example, if you wanted the text to truncate if it would otherwise take up too much space.) – Aaron Brager Jun 11 '15 at 03:03
  • @AaronBrager it was based on the text that is on it, but without the hugging/compression it cannot define the size it should take in screen – Icaro Jun 11 '15 at 03:03
  • I want the title to truncate, without changing the font size of the string, which sounds like compression and no `autoshrink` is the route i need to take right? – Johnathon Sullinger Jun 11 '15 at 03:04
  • @JohnathonSullinger For that behavior, I would set the date label's compression resistance to "1000 (Required)". This way the date will always be visible no matter what, and the other views (the title label, in this case) will work around that by shrinking. – Aaron Brager Jun 11 '15 at 03:05
0

Just a wild guess but is your date label actually being set with any text? Because if not, it would explain the behaviour you're observing.

cbiggin
  • 1,942
  • 1
  • 17
  • 18