Powered by GitBook

WWDC 2015

Mysteries of Auto Layout, Part 1

This session sums up most of the mysteries of auto layout developers come across.

UIStackView

A powerful UIKit component to build up a complex layout without forgiving the maintainability. UIStackView is also able to nested. Hiding the views inside the stackView will make other subviews taking views room. 

//Animation with stackView
UIView.animateWithDuration(1.0) {
     self.subviewToHide.hidden = !self.subviewToHide.hidden
}

Changing Constraints

Prior to iOS 9, for any referenced constraints, we have to remove and re-add the constraints to certain views in order to make these effective or not. In iOS 9, there are activate and deactivate for the constraint to take or not into account when layout engine performs layouting.

Never deactivate self.view.constraints as additional internal constriants added to that view

View Sizing

Use Constraints to define the size of a view Overriding intrinsicContentSize for

  • the size is not calculated by constraints
  • custom drawing
  • provide invalidating
    • calling invalidateIntrinsicContentSize so that the layout system notices the change and can recalculate the layout. 
//calculating width based on superview's width
widthConstraint = NSLayoutConstraint(item: imageView, 
                                    attribute: .Width,
                                    relatedBy: .Equal, 
                                    toItem: self.view, 
                                    attribute: .Width, 
                                    multiplier: 0.75,
                                    constant: 0.0)
//Calculating height based on image's width
heightConstraint =  NSLayoutConstraint(item: imageView, 
                                        attribute: .Height, 
                                        relatedBy: .Equal, 
                                        toItem: imageView,  
                                        attribute: .Width, 
                                        multiplier: 1.5,
                                        constant: 0.0)

UITableViewCell

  • Self-sizing needs size from constraints
  • Width is defined with table view cells
  • Constraints must determine height
    • Take advantage of proportions between views

Ambiguity

  • Not enough constraints to define the size or position of the view
  • Equal, non-required priorities
  • @"V:|-[image]-[caption](==image@751)]-1" to set the constraints' priorities
  • set above or below of the priorities as system uses some priorities as well
  • Content Priorities
    • Content Hugging (Hugging priorities hug content)
    • Hugging
    • Content Compression Resistance (Compression resistance resists squishing)
    • Resist

Alignment

  • use firstBaseLine and lastBaseline to align the first and last of line of text of base lines

Leading and Trailing

  • use leading/trailing instead of left/right to help in localization as some of language are from right to left

Alignment Rects

  • A rect for the most important feature of the view
  • Ususally same as the frame
  • Does not change when view is transformed
  • Override alignmentRectInsets if needed to provide padding
  • get by alignmentRectForFrame:

Related Session