Upgrade to Pro — share decks privately, control downloads, hide ads and more …

iOSDevUK: I 💖StackViews

sammyd
September 09, 2015

iOSDevUK: I 💖StackViews

Imagine a world where you get to use the Auto Layout that you know and love, but with less fighting with stabby constraints. Well, with the introduction of iOS 9, that world has arrived in the form of stack views.

We'll get hands-on in this talk - covering the basics of stack views in IB, best practices for approaching layouts, animation and code. If you want to follow along be sure to have Xcode 7 up and running. Or sit back, and enjoy watching somebody else battling with IB for once.

sammyd

September 09, 2015
Tweet

More Decks by sammyd

Other Decks in Programming

Transcript

  1. Lorem mofo dolizzle bow wow wow check it out, consectetuer

    adipiscing mofo. Shut the shizzle up sapien velit, shut the shizzle up volutpizzle, black tellivizzle, gravida vizzle, you son of a bizzle. Pellentesque dizzle tortor. Sed erizzle. Its fo rizzle bow wow wow crunk dapibizzle da bomb tempizzle tempor. Mauris shizznit nibh et crazy. Shiz in fo shizzle my nizzle. Pellentesque sure rhoncizzle nisi. Fashionista
  2. Pin to Top Pin to Leading Pin to Trailing Pin

    to Bottom Vertical Spacing Vertical Spacing
  3. Pin to Top Pin to Leading Pin to Trailing Pin

    to Bottom Centre Align Centre Align Vertical Spacing Vertical Spacing
  4. Equal Width Pin to Top Pin to Leading Pin to

    Trailing Pin to Bottom Centre Align Centre Align Vertical Spacing Vertical Spacing
  5. Lorem mofo dolizzle bow wow wow check it out, consectetuer

    adipiscing mofo. Shut the shizzle up sapien velit, shut the shizzle up volutpizzle, black tellivizzle, gravida vizzle, you son of a bizzle. Pellentesque dizzle tortor. Sed erizzle. Its fo rizzle bow wow wow crunk dapibizzle da bomb tempizzle tempor. Mauris shizznit nibh et crazy. Shiz in fo shizzle my nizzle. Pellentesque sure rhoncizzle nisi. Fashionista background CC3 © Mark Duncan
  6. background CC3 © Mark Duncan Spacing Centre Aligned Pin to

    Top Pin to Leading Pin to Trailing Pin to Bottom
  7. alignment first baseline Aliquizzle boofron fizzle a fo shizzle my

    nizzle Its fo rizzle Phasellus interdum fizzle tellus. Ut semper adipiscing lorem.
  8. alignment first baseline last baseline Aliquizzle boofron fizzle a fo

    shizzle my nizzle Its fo rizzle Phasellus interdum fizzle tellus. Ut semper adipiscing lorem. Aliquizzle boofron fizzle a fo shizzle my nizzle Its fo rizzle Phasellus interdum fizzle tellus. Ut semper adipiscing lorem.
  9. Lorem mofo dolizzle bow wow wow check it out, consectetuer

    adipiscing mofo. Shut the shizzle up sapien velit, shut the shizzle up volutpizzle, black tellivizzle, gravida vizzle, you son of a bizzle. Pellentesque dizzle tortor. Sed erizzle. Its fo rizzle bow wow wow crunk dapibizzle da bomb tempizzle tempor. Mauris shizznit nibh et crazy. Shiz in fo shizzle my nizzle. Pellentesque sure rhoncizzle nisi. Fashionista background CC3 from wikimedia
  10. Lorem mofo dolizzle bow wow wow check it out, consectetuer

    adipiscing mofo. Shut the shizzle up sapien velit, shut the shizzle up volutpizzle, black tellivizzle, gravida vizzle, you son of a bizzle. Pellentesque dizzle tortor. Sed erizzle. Its fo rizzle bow wow wow crunk dapibizzle da bomb tempizzle tempor. Mauris shizznit nibh et crazy. Phasellus interdum fizzle tellus. Ut semper adipiscing lorem. Donec non est. Pimpin' sapizzle nizzle, ultricizzle nizzle, accumsizzle vel, fermentizzle quizzle, izzle. Fashionista Get this look! £76.50 background CC3 from wikimedia icons CC3 from flaticon.com
  11. UIStackView class UIStackView : UIView { ... var axis: UILayoutConstraintAxis

    var distribution: UIStackViewDistribution var alignment: UIStackViewAlignment var spacing: CGFloat var baselineRelativeArrangement: Bool var layoutMarginsRelativeArrangement: Bool }
  12. UIStackView class UIStackView : UIView { init(arrangedSubviews views: [UIView]) var

    arrangedSubviews: [UIView] { get } func addArrangedSubview(view: UIView) func removeArrangedSubview(view: UIView) func insertArrangedSubview(view: UIView, atIndex stackIndex: Int) ... }
  13. Subviews addSubview addArrangedSubview Add to View Hierarchy ✔ ✔ Add

    to Arranged Views ✘ ✔ removeFromSuperview removeArrangedSubview Remove from View Hierarchy ✔ ✘ Remove from Arranged Views ✔ ✔