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
47

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
64
Migrating to Swift 3
Avatar for Sergio Utama sergioutama
0
55
10 Things I learned while freelancing
Avatar for Sergio Utama sergioutama
0
59
iOS Video Player
Avatar for Sergio Utama sergioutama
0
84
Tribute to Mantle
Avatar for Sergio Utama sergioutama
0
29
Mobile Analytics
Avatar for Sergio Utama sergioutama
0
46

Other Decks in Programming

See All in Programming
DartASTとその活用
Avatar for そた sotaatos
2
120
Eloquentを使ってどこまでコードの治安を保てるのか？を新人が考察してみた
Avatar for ito_kohhh itokoh0405
0
3.1k
Dive into Triton Internals
Avatar for Liam Jongsu Kim appleparan
0
490
CSC509 Lecture 13
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
250
The Missing Link in Angular's Signal Story: Resource API and httpResource
Avatar for Manfred Steyer manfredsteyer
PRO
0
120
퇴근 후 1억이 거래되는 서비스 만들기 | 내가 AI를 사용하는 방법
Avatar for Seungmin 마량 maryang
2
560
予防に勝る防御なし（2025年版） - 堅牢なコードを導く様々な設計のヒント / Growing Reliable Code PHP Conference Fukuoka 2025
Avatar for Takuto Wada twada
PRO
36
12k
開発生産性が組織文化になるまでの軌跡
Avatar for ふくすけ tonegawa07
0
150
AsyncSequenceとAsyncStreamのプロポーザルを全部読む！！
Avatar for Shigure Shimotori s_shimotori
1
280
Atomics APIを知る / Understanding Atomics API
Avatar for TOMIKAWA Sotaro ssssota
1
140
MCPサーバー「モディフィウス」で変更容易性の向上をスケールする / modifius
Avatar for MinoDriven minodriven
8
1.4k
オフライン対応！Flutterアプリに全文検索エンジンを実装する @FlutterKaigi2025
Avatar for JaiChangPark itsmedreamwalker
2
190

Featured

See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.8k
Docker and Python
Avatar for Tania Allard trallard
46
3.6k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
37
2.6k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
210
24k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
10
660
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
24
3.8k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.8k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
76
5.1k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
3.2k

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