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
45

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
Hypervel - A Coroutine Framework for Laravel Artisans
Avatar for Albert Chen albertcht
1
130
0626 Findy Product Manager LT Night_高田スライド_speaker deck用
Avatar for Mana Takada mana_takada
0
180
20250628_非エンジニアがバイブコーディングしてみた
Avatar for ponponmikan ponponmikankan
0
690
猫と暮らす Google Nest Cam生活🐈 / WebRTC with Google Nest Cam
Avatar for Yutaro Muta yutailang0119
0
140
『自分のデータだけ見せたい！』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
Avatar for AkitoTsukahara akitotsukahara
2
640
LT 2025-06-30: プロダクトエンジニアの役割
Avatar for Keisuke Yamamoto yamamotok
0
770
ふつうの技術スタックでアート作品を作ってみる
Avatar for Akira Yagi akira888
1
880
ニーリーにおけるプロダクトエンジニア
Avatar for Nealle nealle
0
840
ペアプロ × 生成AI 現場での実践と課題について / generative-ai-in-pair-programming
Avatar for コドモン開発チーム codmoninc
2
18k
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @enterJS Advanced Angular Day 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
Startups on Rails in Past, Present and Future–Irina Nazarova, RailsConf 2025
Avatar for Irina Nazarova irinanazarova
0
130
すべてのコンテキストを、 ユーザー価値に変える
Avatar for Michiru Kato applism118
3
1.3k

Featured

See All Featured
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
32
2.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.5k
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.5k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
95
6.1k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.1k
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.7k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k
Done Done
Avatar for chrislema chrislema
184
16k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
36
2.8k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k

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