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

Introduction to Adaptive Layout

Ddd6d3bac7772fa67fc5e312a18bdaec?s=47 sammyd
February 06, 2015

Introduction to Adaptive Layout

Slides from RWDevCon 2015. They might not make the most sense, since the talk is of a tutorial format

Ddd6d3bac7772fa67fc5e312a18bdaec?s=128

sammyd

February 06, 2015
Tweet

More Decks by sammyd

Other Decks in Programming

Transcript

  1. Introducing 104: Adaptive Layout Introduction

  2. In the beginning there was…

  3. In the beginning there was…

  4. In the beginning there was…

  5. In the beginning there was…

  6. In the beginning there was…

  7. In the beginning there was… 2 2 2 2 2

    + + + + = 10 layouts
  8. In the past…

  9. this doesn’t scale!

  10. Adaptive Layout introducing…

  11. Adaptive Layout Abstracts layout away from device specifics Introducing concept

    of size classes Available in iOS 8 Fully supported in Xcode and IB
  12. Session Overview Introduction to Size Classes Demo of installable constraints

    & views Lab to learn adaptive fonts and images Challenge to bring it all together
  13. Introducing 104: Adaptive Layout Size Classes

  14. “amount of space available for content”

  15. Size Classes HORIZONTAL VERTICAL

  16. Size Classes HORIZONTAL VERTICAL compact regular

  17. Size Classes Horizontal Vertical iPad Portrait Regular Regular iPad Landscape

    Regular Regular iPhone Portrait Compact Regular iPhone Landscape Compact Compact iPhone 6 Plus Landscape Regular Compact
  18. 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
  19. Introducing 104: Adaptive Layout Demo

  20. Introducing 104: Adaptive Layout Conclusion

  21. Adaptive Layout Universal storyboards FTW Get a long way without

    code Size class overrides are conceptually equivalent to subclassing
  22. Where to go from here? All backed with UITraitCollection in

    code - with additions to UIViewController Adaptive layout is just one part of adaptive UI in iOS8
  23. Where to go from here? Tutorials on raywenderlich.com Chapters in

    iOS 8 by tutorials WWDC videos from Apple
  24. Don’t be scared of Auto Layout

  25. Learn by doing Don’t be scared of Auto Layout

  26. Learn by doing Don’t be scared of Auto Layout Thanks

    @iwantmyrealname shinobicontrols.com/giveaway