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
97
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
生成AIコーディングとの向き合い方、AIと共創するという考え方 / How to deal with generative AI coding and the concept of co-creating with AI
Avatar for shiro seike seike460
PRO
1
350
ニーリーにおけるプロダクトエンジニア
Avatar for Nealle nealle
0
750
なぜ「共通化」を考え、失敗を繰り返すのか
Avatar for Rinchoku rinchoku
1
630
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
Avatar for Yuka O’oka oukayuka
2
890
Discover Metal 4
Avatar for rei rei315
2
110
Hypervel - A Coroutine Framework for Laravel Artisans
Avatar for Albert Chen albertcht
1
110
AWS CDKの推しポイント 〜CloudFormationと比較してみた〜
Avatar for アキキー akihisaikeda
3
320
AIプログラマーDevinは PHPerの夢を見るか？
Avatar for Shinya Saita shinyasaita
1
190
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
Avatar for Shintani Teppei euglena1215
1
120
dbt民主化とLLMによる開発ブースト ~ AI Readyな分析サイクルを目指して ~
Avatar for yosh_yumyum yoshyum
3
560
datadog dash 2025 LLM observability for reliability and stability
Avatar for 株式会社IVRy（社員登壇資料） ivry_presentationmaterials
0
440
Code as Context 〜 1にコードで 2にリンタ 34がなくて 5にルール？ 〜
Avatar for Yoda Keisuke yodakeisuke
0
120

Featured

See All Featured
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.6k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
31
1.3k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
130
19k
Side Projects
Avatar for Sacha Greif sachag
455
42k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
207
24k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
31
8.7k
Fireside Chat
Avatar for paigeccino paigeccino
37
3.5k
The Language of Interfaces
Avatar for Des Traynor destraynor
158
25k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k

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!