Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

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
86
Tribute to Mantle
Avatar for Sergio Utama sergioutama
0
30
Mobile Analytics
Avatar for Sergio Utama sergioutama
0
46

Other Decks in Programming

See All in Programming
非同期処理の迷宮を抜ける: 初学者がつまづく構造的な原因
Avatar for PADAone pd1xx
1
700
Microservices rules: What good looks like
Avatar for Chris Richardson cer
PRO
0
1.2k
TypeScript 5.9 で使えるようになった import defer でパフォーマンス最適化を実現する
Avatar for おおいし bicstone
1
1.3k
ゲームの物理 剛体編
Avatar for Fadis fadis
0
330
30分でDoctrineの仕組みと使い方を完全にマスターする / phpconkagawa 2025 Doctrine
Avatar for Takashi Kanemoto ttskch
3
800
【Streamlit x Snowflake】データ基盤からアプリ開発・AI活用まで、すべてをSnowflake内で実現
Avatar for Ayumu Yamaguchi ayumu_yamaguchi
1
120
TUIライブラリつくってみた / i-just-make-TUI-library
Avatar for kazto kazto
1
370
LLMで複雑な検索条件アセットから脱却する！！ 生成的検索インタフェースの設計論
Avatar for po3rin po3rin
2
660
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
120
チームをチームにするEM
Avatar for hitode909 hitode909
0
300
Why Kotlin? 電子カルテを Kotlin で開発する理由 / Why Kotlin? at Henry
Avatar for Agata Naomichi agatan
2
7k
ハイパーメディア駆動アプリケーションとIslandアーキテクチャ: htmxによるWebアプリケーション開発と動的UIの局所的適用
Avatar for Ryota Nakamura nowaki28
0
400

Featured

See All Featured
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
253
22k
Done Done
Avatar for chrislema chrislema
186
16k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
7.8k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
73
5k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
51k
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
7k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.5k
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
62k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
4.9k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
24
3.8k

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