Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Adaptive Layout Workshop
Search
sammyd
February 20, 2015
Programming
0
340
Adaptive Layout Workshop
The slides which accompany the adaptive layout workshop presented at (amongst others) MobOS 2015.
sammyd
February 20, 2015
Tweet
Share
More Decks by sammyd
See All by sammyd
Core Image: Great when it works
sammyd
1
500
iOS Views & Animations: Learning by stealing
sammyd
1
170
Machine Learning on Mobile—a primer
sammyd
0
98
Core ML: A whistlestop tour
sammyd
1
150
DIY DI
sammyd
2
110
iOSConfSG 2017: Decoding Codable
sammyd
3
190
Machine Learning: deciphering the hype
sammyd
0
130
Notify Me, Notify You. Aha!
sammyd
1
170
SwiftConf 2016: Concurrency on iOS
sammyd
1
170
Other Decks in Programming
See All in Programming
Node-RED を(HTTP で)つなげる MCP サーバーを作ってみた
highu
0
120
ふつうの技術スタックでアート作品を作ってみる
akira888
0
460
明示と暗黙 ー PHPとGoの インターフェイスの違いを知る
shimabox
2
480
VS Code Update for GitHub Copilot
74th
2
620
#QiitaBash MCPのセキュリティ
ryosukedtomita
0
970
すべてのコンテキストを、 ユーザー価値に変える
applism118
3
1.2k
CursorはMCPを使った方が良いぞ
taigakono
1
240
第9回 情シス転職ミートアップ 株式会社IVRy(アイブリー)の紹介
ivry_presentationmaterials
1
280
5つのアンチパターンから学ぶLT設計
narihara
1
160
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
o0h
PRO
1
250
WindowInsetsだってテストしたい
ryunen344
1
240
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
750
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
53
7.7k
Producing Creativity
orderedlist
PRO
346
40k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Building an army of robots
kneath
306
45k
For a Future-Friendly Web
brad_frost
179
9.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
Typedesign – Prime Four
hannesfritz
42
2.7k
Designing for Performance
lara
610
69k
Speed Design
sergeychernyshev
32
1k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
5
260
Rebuilding a faster, lazier Slack
samanthasiow
82
9.1k
Transcript
Adaptive Layout Workshop Sam Davies @iwantmyrealname github.com/sammyd/adaptive-layout-workshop
Requirements • Xcode 6.1 • AdaptiveWeaponry sample project
Plan • AutoLayout refresher • Intro to size classes •
Installable constraints • Handling rotation in a post-rotation world • Adaptive fonts • Configurable constraints • Installable Views
Auto Layout Refresher
Adaptive Layout
In the beginning there was...
In the beginning there was...
In the beginning there was...
In the beginning there was...
In the beginning there was...
In the beginning there was...
In the beginning there was... ...a total of 10 different
layouts
in the past
this doesn't scale
introducing Adaptive Layout • Abstracts layout away from device specifics
• Introducing concept of size classes • Available in iOS 8 • Fully supported in Xcode and IB
"amount of space available for content"
Size classes
Size classes
Size classes
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
Let's Go!
Useful Links sam ⁶ @iwantmyrealname code ⁶ github.com/sammyd/adaptive-layout-workshop free book
⁶ shinobicontrols.com/ios8 competition ⁶ shinobicontrols.com/giveaway Thanks!