Tweet
Tweet

Slide 1

Slide 1 text

I Stack Views …and you should too tiny.cc/stacked

Slide 2

Slide 2 text

i am sam @iwantmyrealname

Slide 3

Slide 3 text

raywenderlich.com

Slide 4

Slide 4 text

take a moment to imagine

Slide 5

Slide 5 text

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

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

Pin to Top Pin to Leading Pin to Trailing Pin to Bottom

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

Pin to Top Pin to Leading Pin to Trailing Pin to Bottom Centre Align Centre Align Vertical Spacing Vertical Spacing

Slide 10

Slide 10 text

Equal Width Pin to Top Pin to Leading Pin to Trailing Pin to Bottom Centre Align Centre Align Vertical Spacing Vertical Spacing

Slide 11

Slide 11 text

nine constraints

Slide 12

Slide 12 text

nine constraints imagine a world where

Slide 13

Slide 13 text

nine constraints imagine a world where is seven too many

Slide 14

Slide 14 text

UIStackView introducing

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

background CC3 © Mark Duncan

Slide 17

Slide 17 text

background CC3 © Mark Duncan

Slide 18

Slide 18 text

background CC3 © Mark Duncan Spacing

Slide 19

Slide 19 text

background CC3 © Mark Duncan Spacing Centre Aligned

Slide 20

Slide 20 text

background CC3 © Mark Duncan Spacing Centre Aligned Pin to Top Pin to Leading

Slide 21

Slide 21 text

background CC3 © Mark Duncan Spacing Centre Aligned Pin to Top Pin to Leading Pin to Trailing Pin to Bottom

Slide 22

Slide 22 text

Stack Views configuring

Slide 23

Slide 23 text

axis

Slide 24

Slide 24 text

axis vertical

Slide 25

Slide 25 text

axis vertical horizontal

Slide 26

Slide 26 text

spacing

Slide 27

Slide 27 text

spacing

Slide 28

Slide 28 text

alignment

Slide 29

Slide 29 text

alignment leading

Slide 30

Slide 30 text

alignment leading centre

Slide 31

Slide 31 text

alignment leading centre trailing

Slide 32

Slide 32 text

alignment top

Slide 33

Slide 33 text

alignment top centre

Slide 34

Slide 34 text

alignment top centre bottom

Slide 35

Slide 35 text

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

Slide 36

Slide 36 text

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.

Slide 37

Slide 37 text

alignment fill

Slide 38

Slide 38 text

distribution

Slide 39

Slide 39 text

distribution

Slide 40

Slide 40 text

distribution

Slide 41

Slide 41 text

distribution fill

Slide 42

Slide 42 text

distribution fill proportionally

Slide 43

Slide 43 text

distribution fill equally

Slide 44

Slide 44 text

distribution equal spacing

Slide 45

Slide 45 text

distribution equal centering

Slide 46

Slide 46 text

Demo time for a

Slide 47

Slide 47 text

Nesting feeling at home with

Slide 48

Slide 48 text

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

Slide 49

Slide 49 text

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

Slide 50

Slide 50 text

background CC3 from wikimedia icons CC3 from flaticon.com Get this look! £76.50

Slide 51

Slide 51 text

background CC3 from wikimedia icons CC3 from flaticon.com

Slide 52

Slide 52 text

background CC3 from wikimedia icons CC3 from flaticon.com

Slide 53

Slide 53 text

background CC3 from wikimedia icons CC3 from flaticon.com

Slide 54

Slide 54 text

background CC3 from wikimedia icons CC3 from flaticon.com

Slide 55

Slide 55 text

background CC3 from wikimedia icons CC3 from flaticon.com

Slide 56

Slide 56 text

Demo time for a

Slide 57

Slide 57 text

Animation make like disney and do some

Slide 58

Slide 58 text

It’s all in the UIView UIView.animateWithDuration(duration) { // Stick it in here }

Slide 59

Slide 59 text

It’s all in the UIView UIView.animateWithDuration(duration) { } axis

Slide 60

Slide 60 text

It’s all in the UIView UIView.animateWithDuration(duration) { } spacing

Slide 61

Slide 61 text

It’s all in the UIView UIView.animateWithDuration(duration) { } alignment

Slide 62

Slide 62 text

It’s all in the UIView UIView.animateWithDuration(duration) { } distribution

Slide 63

Slide 63 text

It’s all in the UIView UIView.animateWithDuration(duration) { oneOfTheSubviews.hidden = true }

Slide 64

Slide 64 text

Demo time for a

Slide 65

Slide 65 text

Code IB scares me, show me some

Slide 66

Slide 66 text

UIStackView class UIStackView : UIView { ... var axis: UILayoutConstraintAxis var distribution: UIStackViewDistribution var alignment: UIStackViewAlignment var spacing: CGFloat var baselineRelativeArrangement: Bool var layoutMarginsRelativeArrangement: Bool }

Slide 67

Slide 67 text

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) ... }

Slide 68

Slide 68 text

Subviews addSubview addArrangedSubview Add to View Hierarchy ✔ ✔ Add to Arranged Views ✘ ✔ removeFromSuperview removeArrangedSubview Remove from View Hierarchy ✔ ✘ Remove from Arranged Views ✔ ✔

Slide 69

Slide 69 text

Demo time for a

Slide 70

Slide 70 text

Remember some things to

Slide 71

Slide 71 text

Auto Layout get to know 1

Slide 72

Slide 72 text

understand 2AL Priorities

Slide 73

Slide 73 text

be like a bird and 3 Nest

Slide 74

Slide 74 text

bin off 4 iOS 7 & 8

Slide 75

Slide 75 text

stack once you you won’t go back

Slide 76

Slide 76 text

stack once you you won’t go back @iwantmyrealname iwantmyreal.name github.com/sammyd/iOSDevUK-StackViews