Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
executable file 161 lines (91 sloc) 2.63 KB

Universal Layout Workshop

Sam Davies

@iwantmyrealname

github.com/sammyd/360UniversalLayoutWorkshop

(bit.do/360layout)


Requirements

Xcode 7β5

StackReview sample project

bit.do/360layout


Plan

  • Auto Layout refresher
  • Adaptive Layout
  • Handling rotation in a post-rotation world
  • Stack Views

Auto Layout Refresher


Adaptive Layout


In the beginning there was...


In the beginning there was...

inline


In the beginning there was...

inline 60%inline 60%


In the beginning there was...

inline 40%inline 80%


In the beginning there was...

inline 30%inline 60%inline 60%


In the beginning there was...

inline 30%inline 60%inline 60%inline 60%inline 60%


In the beginning there was...

inline 30%inline 60%inline 60%inline 60%inline 60%

...a total of 10 different layouts


in the past

inline


this doesn't scale


introducing Adaptive Layout

  • Abstracts layout away from device specifics
  • Introducing concept of size classes
  • Available in iOS 8
  • Fully supported in Xcode and IB

"amount of space available for content"


Size classes

inline


Size classes

inlineinline 80%


Size classes

inline


Multi-tasking

fit


Approach to adaptive layout

  1. Build base layout
  2. Choose size class override
  3. Uninstall irrelevant constraints
  4. Add new constraints specific to size class
  5. Rinse and repeat

Let's Go!


Stack Views


fit


Stack View Properties

  • Axis
  • Alignment
  • Spacing
  • Distribution

Useful Links

sam ⇄ @iwantmyrealname

code ⇄ github.com/sammyd/360UniversalLayoutWorkshop

videos ⇄ raywenderlich.com/video-tutorials

Thanks!