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
100
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
為你自己學 Python - 冷知識篇
Avatar for 高見龍 eddie
1
350
Kiroで始めるAI-DLC
Avatar for kaonash kaonash
2
630
プロパティベーステストによるUIテスト: LLMによるプロパティ定義生成でエッジケースを捉える
Avatar for Tetta Noguchi tetta_pdnt
0
4.3k
知っているようで知らない"rails new"の世界 / The World of "rails new" You Think You Know but Don't
Avatar for luccafort luccafort
PRO
1
190
テストコードはもう書かない：JetBrains AI Assistantに委ねる非同期処理のテスト自動設計・生成
Avatar for makun makun
0
540
ファインディ株式会社におけるMCP活用とサービス開発
Avatar for starfish719 starfish719
0
2.1k
HTMLの品質ってなんだっけ？ “HTMLクライテリア”の設計と実践
Avatar for una unachang113
4
2.9k
Namespace and Its Future
Avatar for Satoshi Tagomori tagomoris
6
710
概念モデル→論理モデルで気をつけていること
Avatar for sunnyone sunnyone
3
300
Laravel Boost 超入門
Avatar for Arlo fire_arlo
3
220
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
Avatar for Takahashi Ikki takahashiikki
1
120
rage against annotate_predecessor
Avatar for Junichi Kobayashi junk0612
0
170

Featured

See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.7k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
36
2.5k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
339
57k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
272
27k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
22k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
3
620
Navigating Team Friction
Avatar for Lara Hogan lara
189
15k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
224
9.9k
Code Review Best Practice
Avatar for Trisha Gee trishagee
71
19k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3k
Designing for Performance
Avatar for Lara Hogan lara
610
69k

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!