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

Adaptive Layout Workshop

Avatar for sammyd sammyd
February 20, 2015
Programming
0
340

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
98
Core ML: A whistlestop tour
Avatar for sammyd sammyd
1
150
DIY DI
Avatar for sammyd sammyd
2
110
iOSConfSG 2017: Decoding Codable
Avatar for sammyd sammyd
3
190
Machine Learning: deciphering the hype
Avatar for sammyd sammyd
0
130
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
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @enterJS Advanced Angular Day 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
270
可変変数との向き合い方 $$変数名が踊り出す$$ / php conference Variable variables
Avatar for Gunji gunji
0
180
Advanced Micro Frontends: Multi Version/ Framework Scenarios @WAD 2025, Berlin
Avatar for Manfred Steyer manfredsteyer
PRO
0
390
AIともっと楽するE2Eテスト
Avatar for Yohei Maeda myohei
8
3k
「テストは愚直&&網羅的に書くほどよい」という誤解 / Test Smarter, Not Harder
Avatar for Munetoshi Ishikawa munetoshi
0
200
おやつのお供はお決まりですか？@WWDC25 Recap -Japan-\(region).swift
Avatar for gangan shingangan
0
140
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
Avatar for nrs nrslib
2
1.1k
リバースエンジニアリング新時代へ！
GhidraとClaude DesktopをMCPで繋ぐ/findy202507
Avatar for @tkmru tkmru
3
960
テストから始めるAgentic Coding 〜Claude Codeと共に行うTDD〜 / Agentic Coding starts with testing
Avatar for r-kagaya rkaga
15
5.6k
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
Avatar for yakenji yakenji
0
150
マッチングアプリにおけるフリックUIで苦労したこと
Avatar for yuhei yuheiito
0
190
ISUCON研修おかわり会 講義スライド
Avatar for Yuki Yata arfes0e2b3c
1
470

Featured

See All Featured
Navigating Team Friction
Avatar for Lara Hogan lara
187
15k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
278
23k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.5k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
34
3.1k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
31
8.7k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
31
1.3k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
29
2.7k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
161
15k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
71
11k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
134
9.4k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
25
1.7k

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!