A talk given at the Tokyo iOS Meetup on November 18th, 2017. It explains why, after about two years of being a strong Auto Layout advocate, I am drifting back to manual layout. This progression happened because, after finding a layout that was difficult to achieve with Auto Layout and resorting to manual layout in one specific case, I found that, by writing some very simple functions, I could achieve many of the same layouts as Auto Layout with a similar code size.
23. Manual Layout Operations
— Add convenience methods to simplify code
— Apply changes to collections of views at the same time
24. Manual Layout Operations
— Add convenience methods to simplify code
— Apply changes to collections of views at the same time
— Arrange a collection of views in a particular order
25. Manual Layout Operations
— Add convenience methods to simplify code
— Apply changes to collections of views at the same time
— Arrange a collection of views in a particular order
— Resize one view to make a collection fit on the screen
34. Arranging Horizontally or Vertically
It is common to arrange views along an axis (consider UIStackView).
35. Arranging Horizontally or Vertically
func arrangeTopToBottom(views: [UIView]) {
guard var currentPosition = views.first?.top else { return }
for view in views {
view.top = currentPosition
currentPosition += view.height
}
}
36. Resizing to Fit On Screen
Most of the time,a layout design will fit into two cases:
— The layout is not intended to fit on the screen.Usually this type of
layout will be placed inside a UIScrollView or one of its subclasses.
— The layout is intended to fit on the screen.
37. Resizing to Fit On Screen
For the second case—in a surprising number of instances—the layout can
be achieved by simply resizing a single view so that its height fills
whatever space is left by the other views.
38. Resizing to Fit On Screen
func resize(view: UIView, in views: [UIView], toFitHeight height: CGFloat) {
let heightOfViews = views.reduce(CGFloat(0)) { memo, currentView in
guard view != currentView else { return memo }
var mutableMemo = memo
mutableMemo += view.height
return mutableMemo
}
view.height = height - heightOfViews
}
39. Resizing to Fit On Screen
func resize(views:[UIView], toFitHeight height: CGFloat) {
views.forEach { view in
view.height = height / CGFloat(views.count)
}
}
40. Resizing to Fit On Screen
— There are a lot of potential resizing functions.
— Resizing also requires considering potential error cases.Can you
guarantee that the content will fit?
44. What about...?
— Top or bottom margins
— Spacing between the elements
— Sizing UILabels or UITextViews to fit their content
45. What about...?
— Top or bottom margins
— Spacing between the elements
— Sizing UILabels or UITextViews to fit their content
— Aligning to the first or last baseline text
46. What about...?
— Top or bottom margins
— Spacing between the elements
— Sizing UILabels or UITextViews to fit their content
— Aligning to the first or last baseline text
— Sizing UIImageViews to preserve their aspect ratio
47. What about...?
— Top or bottom margins
— Spacing between the elements
— Sizing UILabels or UITextViews to fit their content
— Aligning to the first or last baseline text
— Sizing UIImageViews to preserve their aspect ratio
48. What about...?
— Top or bottom margins
— Spacing between the elements
— Sizing UILabels or UITextViews to fit their content
— Aligning to the first or last baseline text
— Sizing UIImageViews to preserve their aspect ratio
— Leading and trailing rather than left and right
