Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
StoryBoard+AutoLayout Bad Knowhow
Search
shoby
April 22, 2014
Programming
14
3.8k
StoryBoard+AutoLayout Bad Knowhow
iphone_dev_jp 東京 feat. Ben Zottoの発表資料です
shoby
April 22, 2014
Tweet
Share
More Decks by shoby
See All by shoby
フリルのCMを支える分析 (メディアバイイング編)
shoby
0
410
FirebaseとBigQueryによるアプリのKPI分析(CMの効果検証編)
shoby
2
2.5k
ユーザーに受け入れられ、問題を起こしづらい大規模リニューアルの進め方
shoby
60
13k
ReactiveCocoaで作る快適な登録フォーム
shoby
0
320
フリルの商品を色で検索できるようにした話
shoby
5
4.2k
Search fashion items by colors
shoby
0
140
iOS 7をサポート対象外にして開発を健全化する
shoby
3
3.9k
Apple Watch Tips
shoby
0
3.9k
WWDC 2015で 発表された新機能と サービスへの活かし方
shoby
2
7.3k
Other Decks in Programming
See All in Programming
Kubernetes History Inspector(KHI)を触ってみた
bells17
0
200
AHC041解説
terryu16
0
590
[Fin-JAWS 第38回 ~re:Invent 2024 金融re:Cap~]FaultInjectionServiceアップデート@pre:Invent2024
shintaro_fukatsu
0
400
Immutable ActiveRecord
megane42
0
130
第3回 Snowflake 中部ユーザ会- dbt × Snowflake ハンズオン
hoto17296
4
360
[JAWS-UG横浜 #80] うわっ…今年のServerless アップデート、少なすぎ…?
maroon1st
1
170
[JAWS-UG横浜 #79] re:Invent 2024 の DB アップデートは Multi-Region!
maroon1st
1
140
2024年のkintone API振り返りと2025年 / kintone API look back in 2024
tasshi
0
210
AWSマネコンに複数のアカウントで入れるようになりました
yuhta28
2
160
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
150
Open source software: how to live long and go far
gaelvaroquaux
0
620
昭和の職場からアジャイルの世界へ
kumagoro95
1
350
Featured
See All Featured
Navigating Team Friction
lara
183
15k
Code Review Best Practice
trishagee
66
17k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
Why Our Code Smells
bkeepers
PRO
335
57k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Building an army of robots
kneath
302
45k
A better future with KSS
kneath
238
17k
Building Your Own Lightsaber
phodgson
104
6.2k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Git: the NoSQL Database
bkeepers
PRO
427
64k
Done Done
chrislema
182
16k
Transcript
4UPSZ#PBSE ʴ"VUP-BZPVU όουϊϋ @shobyshoby
ࣗݾհ pixivͰΞϓϦͭͬͯ͘·͢
ຊ
Έͳ͞Μ ίʔυ ៉ྷʹอͬͯ·͔͢ʁ
ʮʔ͍ʂ ɹςετॻ͍ͯΔ͠ ɹϦϑΝΫλϦϯά ɹͯ͠·ʔ͢ʂʯ
StoryBoard…ʁ
※࣮ࡏͨ͠StoryBoard
Ͳ͏ͯ͜͠͏ͳͬͨ…
ࣄͷܦҢ
pixivͷΞϓϦͰ StoryBoardΛ ͍͕ͬͯͨഁͨ͠
UI͕ݪҼͷ ɹΫϥογϡ͕සൃ Ұཡੑ͕ѱԽ ɹભҠͷѲ͕ࠔʹ GitͰConflict͠·͘Γ
ݪҼ
UIʹؔ͢Δ ϝϯςφϯεҙࣝͷ͞ iPhoneͱiPadͰͷ UI͍ճ͠ ରԠόʔδϣϯiOS 5ʙ
StoryBoardͭΒ͍… ! ͔ͱ͍ͬͯ ॻ͖͢ͷͭΒ͍…
;ͱݟͨυΩϡϝϯτ https://developer.apple.com/jp/devcenter/ios/library/ documentation/AutolayoutPG.pdf
Auto LayoutΛಋೖ͢Εɺը໘ͷେ ͖͖͞ɺ ҬઃఆʢݴޠͳͲʣͷҧ͍ʹԠͯ͡ ಈతʹมԽ͢Δɺ൚༻తͳը໘ϨΠΞ τΛ࡞Γग़͢͜ͱ͕Ͱ͖·͢ɻ
͜Εʂ
Auto Layout͓͏ ͍ͭͰʹ ϦϑΝΫλϦϯά͠Α͏
త
StoryBoardΛ ៉ྷʹอͪͭͭ Auto LayoutΛ ͏·͍͜ͱ͍͍ͨʂ
4UPSZ#PBSE ʴ"VUP-BZPVU όουϊϋ
֓ཁ
αϙʔτ04ΛΔ ػೳΛΔ 4UPSZ#PBSEΛׂ͢Δ 7JFX$POUSPMMFSΛׂ͢Δ ίʔυͰԿͱ͔͢Δ
αϙʔτ04ΛΔ
iOS 6ҎԼΛ ΓࣺͯΔ https://developer.apple.com/support/appstore/
ػೳΛΔ
ػೳΛΔ͜ͱͰ ը໘ߏΛ γϯϓϧʹอͭ
ػೳ͕ݮΔͱ…
ViewController͕ݮΔ Segue͕ݮΔ ಠࣗContainer͕ݮΔ ΧελϜView͕ݮΔ
Happy !
ͱ͍͑… ϦϦʔεࡁΈͷΞϓϦͰ ػೳΛΔͷࠔ
σʔλΛͬͯ આಘ͠Α͏
4UPSZ#PBSEΛ ׂ͢Δ
ViewControllerͷ ґଘؔΛݮΒ͢ Git࡞ۀͰͷ ConflictΛ͙
ׂํ
TabBarͷதΛΓग़͢ ModalΛΓग़͢ ଟͷSegue͕ுΒΕͨ ViewControllerΛΓग़͢
7JFX$POUSPMMFSΛ ׂ͢Δ
Viewͷ֊ߏΛ γϯϓϧʹ͢Δ AutoLayoutͷ ConstraintΛ ཧղՄೳͳϨϕϧʹ͢Δ
Auto Layout ਓྨʹૣ͗͢Δ ! ʢଞਓͷConstraint ɹཧղͰ͖ͳ͍ʣ
ཧղͰ͖ͳ͍Ϩϕϧ ෳͷࢠViewಉ͕࢜ґଘؔΛ࣋ͬͯΔ
ཧղͰ͖ͳ͍Ϩϕϧ ֊ߏ͕ෳࡶ
ཧղͰ͖ΔϨϕϧ 2ͭͷViewಉ࢜ͷ੍…͙Β͍
Γग़ͤΔ෦Λ ผͷViewControllerʹ childViewControllerʹ͢Δ
Γग़ͤͦ͏ͳॴ
Place Holder PlaceHolderͱͳΔViewΛஔ͍ͯ addSubView + addChildViewController
2ͭͷViewಉ࢜ͷ ੍ʹͰ͖ͨʂ
ίʔυͰԿͱ͔͢Δ
Ͳ͏ͯ͠ ͍͠෦͚ͩ ίʔυͰԿͱ͔͢Δ
ConstraintʹIBOutletΛ ܨ͍ͯมߋ͢Δ ConstraintΛ ίʔυͰॻ͘
ConstraintΛ ίʔυͰॻ͘߹ MasonryΛ͏ͱศར https://github.com/cloudkite/Masonry
Masonryͷ͍ํ // Ճ [view makeConstraints:^(MASConstraintMaker *make) { make.edges.equalTo(self.view); }]; !
// ߋ৽ [view updateConstraints:^(MASConstraintMaker *make) { make.edges.equalTo(self.view); }];
݁Ռ
Before
After
Happy !
݁ہ"VUP-BZPVU ͬͯͲ͏ͳͷʁ
ྑ͍ॴ
UIʹΑΔ Ϋϥογϡόά͕ ݮͬͨ
σβΠφʔ͞Μ͕ Pull RequestΛ ૹͬͯ͘ΕΔΑ͏ʹͳͬͨ
merge࣌ ඞ࣮ͣߦͯ͠ ֬ೝ͢ΔΑ͏ʹͳͬͨ ʢGitHub্ͩͱ͔Βͳ͍ͷͰ…ʣ
ѱ͍ॴ
৬ਓٕΛΒΕΔͱ ·ͬͨ͘ཧղͰ͖ͳ͍
ϨΠΞτ่Εͷ ݪҼ͕௫ΈͮΒ͘ͳͬͨ
ܧଓͯ͠ ϝϯςφϯεͰ͖Δ ؾ͕͠ͳ͍…
"VUP-BZPVU ͏͖ʁ
https://twitter.com/k_katsumi/status/455340572820000768
ۜͷؙͰͳ͍ ศརʹ͑ศར
·ͱΊ
ػೳΛͬͯγϯϓϧʹ͢Δ 4UPSZ#PBSEΛׂ͢Δ 7JFX$POUSPMMFSΛׂ͢Δ ࠷ޙʹίʔυͰԿͱ͔͢Δ ศརʹͬͯɺ6*Λ៉ྷʹ
͓͠·͍