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

Taming AutoLayout

Avatar for Sergio Utama Sergio Utama
March 21, 2016
Programming
0
44

Taming AutoLayout

Initially presented during MyCocoaheads (https://www.facebook.com/groups/mycocoaheads/) meetup
Avatar for Sergio Utama

Sergio Utama

March 21, 2016
Tweet

More Decks by Sergio Utama

See All by Sergio Utama
Easy Way to Improve ReactNative
Avatar for Sergio Utama sergioutama
0
270
From try! Swift Tokyo 2017
Avatar for Sergio Utama sergioutama
0
63
Migrating to Swift 3
Avatar for Sergio Utama sergioutama
0
54
10 Things I learned while freelancing
Avatar for Sergio Utama sergioutama
0
58
iOS Video Player
Avatar for Sergio Utama sergioutama
0
80
Tribute to Mantle
Avatar for Sergio Utama sergioutama
0
29
Mobile Analytics
Avatar for Sergio Utama sergioutama
0
44

Other Decks in Programming

See All in Programming
AIプログラマーDevinは PHPerの夢を見るか？
Avatar for Shinya Saita shinyasaita
1
230
状態遷移図を書こう / Sequence Chart vs State Diagram
Avatar for Kuniwak orgachem
PRO
0
100
チームのテスト力を総合的に鍛えて品質、スピード、レジリエンスを共立させる/Testing approach that improves quality, speed, and resilience
Avatar for Hiroki Iseri goyoki
5
900
Blazing Fast UI Development with Compose Hot Reload (droidcon New York 2025)
Avatar for Márton Braun zsmb
1
300
Team operations that are not burdened by SRE
Avatar for zosokh kazatohiei
1
310
明示と暗黙 ー PHPとGoの インターフェイスの違いを知る
Avatar for shimabox shimabox
2
520
「Cursor/Devin全社導入の理想と現実」のその後
Avatar for Ryoichi Saito saitoryc
0
830
The Modern View Layer Rails Deserves: A Vision For 2025 And Beyond @ RailsConf 2025, Philadelphia, PA
Avatar for Marco Roth marcoroth
2
310
ソフトウェア品質を数字で捉える技術。事業成長を支えるシステム品質の マネジメント
Avatar for takuya542 takuya542
2
13k
“いい感じ“な定量評価を求めて - Four Keysとアウトカムの間の探求 -
Avatar for Nealle nealle
2
10k
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
Avatar for Shintani Teppei euglena1215
1
170
Rubyでやりたい駆動開発 / Ruby driven development
Avatar for chobishiba chobishiba
1
730

Featured

See All Featured
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
25
1.7k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
51
3.3k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
2.9k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
42
7.4k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
10
690
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
31
8.7k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
184
22k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.3k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
367
19k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k

Transcript

  1. Taming AutoLayout @sergioutama

  2. Thinking Constraint “ It’s relationship between one view with another

    “

  3. Center Y Center X height width baseline leading trailing top

    bottom A

  4. Autolayout Component Priority Hugging and Compression

  5. AutoLayout Frame ♥

  6. view.translatesAutoresizingMaskIntoConstraints Follow the rules setNeedsUpdateConstraints() layoutSubviews() viewdidLayoutSubviews() autoresize layout pass

    setNeedsLayout() => super.setNeedsLayout()

  7. Follow the rules “ superview only change it’s direct subviews

    “

  8. Debug Autolayout ensure x, y, & size ensure priority set

    constraint identifier set view accessibility identifier

  9. DEMO

  10. Reference wwdc2015/218 wwdc2015/219 Apple AutoLayout Programming Guide

  11. QA

  12. Thank you @sergioutama