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
530
iOS Views & Animations: Learning by stealing
Avatar for sammyd sammyd
1
180
Machine Learning on Mobile—a primer
Avatar for sammyd sammyd
0
120
Core ML: A whistlestop tour
Avatar for sammyd sammyd
1
170
DIY DI
Avatar for sammyd sammyd
2
120
iOSConfSG 2017: Decoding Codable
Avatar for sammyd sammyd
3
200
Machine Learning: deciphering the hype
Avatar for sammyd sammyd
0
160
Notify Me, Notify You. Aha!
Avatar for sammyd sammyd
1
180
SwiftConf 2016: Concurrency on iOS
Avatar for sammyd sammyd
1
180

Other Decks in Programming

See All in Programming
CSC307 Lecture 07
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
550
ThorVG Viewer In VS Code
Avatar for Nor-s nors
0
770
Oxlint JS plugins
Avatar for kazupon kazupon
1
790
React 19でつくる「気持ちいいUI」- 楽観的UIのすすめ
Avatar for Hiroshi Morishige himorishige
11
6k
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
Avatar for ahu ahuglajbclajep
5
990
AIエージェント、”どう作るか”で差は出るか？ / AI Agents: Does the "How" Make a Difference?
Avatar for r-kagaya rkaga
4
2k
AI時代のキャリアプラン「技術の引力」からの脱出と「問い」へのいざない / tech-gravity
Avatar for MinoDriven minodriven
20
6.9k
CSC307 Lecture 03
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
490
インターン生でもAuth0で 認証基盤刷新が出来るのか
Avatar for takumi taku271
0
190
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
Avatar for petamoriken / 森建 petamoriken
0
200
今から始めるClaude Code超入門
Avatar for 448jp | OKI Yoshiya 448jp
7
8.5k
Rust 製のコードエディタ “Zed” を使ってみた
Avatar for NearMeの技術発表資料です nearme_tech
PRO
0
150

Featured

See All Featured
エンジニアに許された特別な時間の終わり
Avatar for watany watany
106
230k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
Avatar for Tomoya Matsuura tomoyanonymous
2
410
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.8k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.1k
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
320
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
1
240
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
60
42k
Google's AI Overviews - The New Search
Avatar for Barry Adams badams
0
900
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
290
ラッコキーワード サービス紹介資料
Avatar for ラッコ株式会社 rakko
1
2.2M
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
630

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!