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

Adaptive Layout Workshop

Avatar for sammyd sammyd
February 20, 2015
Programming
0
350

Adaptive Layout Workshop

The slides which accompany the adaptive layout workshop presented at (amongst others) MobOS 2015.

Avatar for sammyd

sammyd

February 20, 2015
Tweet

More Decks by sammyd

See All by sammyd
Core Image: Great when it works
Avatar for sammyd sammyd
1
500
iOS Views & Animations: Learning by stealing
Avatar for sammyd sammyd
1
170
Machine Learning on Mobile—a primer
Avatar for sammyd sammyd
0
110
Core ML: A whistlestop tour
Avatar for sammyd sammyd
1
160
DIY DI
Avatar for sammyd sammyd
2
110
iOSConfSG 2017: Decoding Codable
Avatar for sammyd sammyd
3
200
Machine Learning: deciphering the hype
Avatar for sammyd sammyd
0
140
Notify Me, Notify You. Aha!
Avatar for sammyd sammyd
1
170
SwiftConf 2016: Concurrency on iOS
Avatar for sammyd sammyd
1
170

Other Decks in Programming

See All in Programming
「ちょっと古いから」って避けてた技術書、今だからこそ読もう
Avatar for もっち mottyzzz
10
6.4k
iOSエンジニア向けの英語学習アプリを作る！
Avatar for yukawashouhei yukawashouhei
0
190
Go Conference 2025: Goで体感するMultipath TCP ― Go 1.24 時代の MPTCP Listener を理解する
Avatar for Takeru Hayasaka takehaya
8
1.6k
Django Ninja による API 開発効率化とリプレースの実践
Avatar for Kashun Yoshida kashewnuts
0
1.2k
その面倒な作業、「Dart」にやらせませんか？ Flutter開発者のための業務効率化
Avatar for YomEngine yordgenome03
0
100
CSC305 Lecture 06
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
210
Six and a half ridiculous things to do with Quarkus
Avatar for Holly Cummins hollycummins
0
140
Conquering Massive Traffic Spikes in Ruby Applications with Pitchfork
Avatar for Shia riseshia
0
160
明日から始めるリファクタリング
Avatar for ryounasso ryounasso
0
130
Back to the Future: Let me tell you about the ACP protocol
Avatar for Benedikt Terhechte terhechte
0
140
After go func(): Goroutines Through a Beginner’s Eye
Avatar for Vaibhav Gupta 97vaibhav
0
310
What's new in Spring Modulith?
Avatar for Oliver Drotbohm olivergierke
1
130

Featured

See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
30
2.9k
How GitHub (no longer) Works
Avatar for Zach Holman holman
315
140k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
45
2.5k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.6k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.8k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
347
40k
Writing Fast Ruby
Avatar for Erik Berlin sferik
629
62k
Fireside Chat
Avatar for paigeccino paigeccino
40
3.7k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
45
7.7k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
9
850
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
27k

Transcript

  1. Adaptive Layout Workshop Sam Davies @iwantmyrealname github.com/sammyd/adaptive-layout-workshop

  2. Requirements • Xcode 6.1 • AdaptiveWeaponry sample project

  3. Plan • AutoLayout refresher • Intro to size classes •

    Installable constraints • Handling rotation in a post-rotation world • Adaptive fonts • Configurable constraints • Installable Views

  4. Auto Layout Refresher

  5. Adaptive Layout

  6. In the beginning there was...

  7. In the beginning there was...

  8. In the beginning there was...

  9. In the beginning there was...

  10. In the beginning there was...

  11. In the beginning there was...

  12. In the beginning there was... ...a total of 10 different

    layouts

  13. in the past

  14. this doesn't scale

  15. introducing Adaptive Layout • Abstracts layout away from device specifics

    • Introducing concept of size classes • Available in iOS 8 • Fully supported in Xcode and IB

  16. "amount of space available for content"

  17. Size classes

  18. Size classes

  19. Size classes

  20. 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

  21. Let's Go!

  22. Useful Links sam ⁶ @iwantmyrealname code ⁶ github.com/sammyd/adaptive-layout-workshop free book

    ⁶ shinobicontrols.com/ios8 competition ⁶ shinobicontrols.com/giveaway Thanks!