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
制約のなかでContainerViewControllerを つくる方法
Search
Mitsuyoshi Yamazaki
September 18, 2018
Technology
5
850
制約のなかでContainerViewControllerを つくる方法
ChildViewControllerが依存しあっているような制約のもとでも、汎用のContainerViewControllerを作る方法を詳解します
Mitsuyoshi Yamazaki
September 18, 2018
Tweet
Share
More Decks by Mitsuyoshi Yamazaki
See All by Mitsuyoshi Yamazaki
人工生命
mitsuyoshiyamazaki
0
1.5k
人工生命の世界
mitsuyoshiyamazaki
0
1.8k
Other Decks in Technology
See All in Technology
現地速報!Microsoft Ignite 2025 M365 Copilotアップデートレポート
kasada
1
280
AIを前提に、業務を”再構築”せよ IVRyの9ヶ月にわたる挑戦と未来の働き方 (BTCONJP2025)
yueda256
1
750
レビュー負債を解消する ― CodeRabbitが支えるAI駆動開発
moongift
PRO
0
400
AWS資格は取ったけどIAMロールを腹落ちできてなかったので、年内に整理してみた
hiro_eng_
0
230
JJUG CCC 2025 Fall バッチ性能!!劇的ビフォーアフター
hayashiyuu1
1
340
マイクロリブート ~ACEマインドセットで実現するアジャイル~
sony
1
390
機密情報の漏洩を防げ! Webフロントエンド開発で意識すべき漏洩パターンとその対策
mizdra
PRO
9
3.5k
大規模モノレポの秩序管理 失速しない多言語化フロントエンドの運用 / JSConf JP 2025
shoota
0
170
『HOWはWHY WHATで判断せよ』 〜『ドメイン駆動設計をはじめよう』の読了報告と、本質への探求〜
panda728
PRO
5
1.9k
「O(n log(n))のパフォーマンス」の意味がわかるようになろう
dhirabayashi
0
180
Quarkusで作るInteractive Stream Application
joker1007
0
150
ZOZOTOWNカート決済リプレイス ── モジュラモノリスという過渡期戦略
zozotech
PRO
0
400
Featured
See All Featured
Product Roadmaps are Hard
iamctodd
PRO
55
12k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
A Modern Web Designer's Workflow
chriscoyier
697
190k
YesSQL, Process and Tooling at Scale
rocio
174
15k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
2.9k
How GitHub (no longer) Works
holman
315
140k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Speed Design
sergeychernyshev
32
1.2k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
658
61k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
A designer walks into a library…
pauljervisheath
210
24k
Navigating Team Friction
lara
190
15k
Transcript
੍ͷͳ͔Ͱ ContainerViewControllerΛ ͭ͘Δํ๏ @vespid v2.2.1
About me • Twitter: @vespid • GitHub: mitsuyoshi-yamazaki • SpeeeͰSwift։ൃ৽نࣄۀͷ
ϢʔβʔΠϯλϏϡʔͳͲ
ࡢॴଐ͍ͯͨ͠ࣄۀ෦ • iOS։ൃऀͱͯ͠ ඒ༰ΞϓϦΛ୲ • TwitterͷϓϩϑΟʔϧ ը໘ͷ࠶ݱ
͍͍ײ͡ʹOSSԽͰ͖ͨ HJUIVCDPNTQFFF 4DSPMMBCMF5BC$POUSPMMFS
Έͳ͞Μ
ᕒͷUI͕࠶ར༻Ͱ͖ͳ͍
ͱ͍͏͜ͱͳ͍Ͱ͠ΐ͏͔
ContainerViewControllerΛ ͬͨ͜ͱͷ͋Δํ ଟ͍ͱࢥ͍·͕͢
൚༻Խ͕͍͜͠ͱ
੍ͷͳ͔Ͱ ContainerViewControllerΛ ͭ͘Δํ๏ʹ͍ͭͯઆ໌͠·͢
• εΫϩʔϧʹΑͬͯ ϔομʔ͕ॖΉ • ChildVC ϔομʔͱλϒͷத ྫɿTwitter UI
Twitter UIͷ;ͨͭͷཁૉ 1.ScrollViewΛΈ߹ΘͤͨView • εΫϩʔϧͱಉظͨ͠Ξχϝʔγϣϯ 2.൚༻ContainerViewController • ChildViewControllerಉ࢜ͷಠཱΛอͭ Twitter UIΛςʔϚʹબΜͩཧ༝ɿ
Twitter UIͷ;ͨͭͷཁૉ 1.ScrollViewΛΈ߹ΘͤͨView • εΫϩʔϧͱಉظͨ͠Ξχϝʔγϣϯ 2.൚༻ContainerViewController • ChildViewControllerಉ࢜ͷಠཱΛอͭ Twitter UIΛςʔϚʹબΜͩཧ༝ɿ
੍ͷͱ൚༻Խ͢Δͷ͕͍͠
Ͳ͏ͭ͘Δ͔ʁ
ContainerViewControllerͷઃܭ • ΠϯλʔϑΣʔεΛఆٛ͢Δ • ChildViewControllerؒͷಠཱੑΛ୲อ͢Δ • ্࣮ͷ੍Λղܾ͢ΔɿࠓճScrollViewؔ࿈
ContainerViewControllerͷઃܭ • ΠϯλʔϑΣʔεΛఆٛ͢Δ • ChildViewControllerؒͷಠཱੑΛ୲อ͢Δ • ্࣮ͷ੍Λղܾ͢ΔɿࠓճScrollViewؔ࿈
ΠϯλʔϑΣʔεΛఆٛ͢Δ • ཁ • ͍͍͢ΠϯλʔϑΣʔεΛ༻ҙ͍ͨ͠ • UIKit४ڌ
ΠϯλʔϑΣʔεΛఆٛ͢Δ ϔομʔ λϒ εΫϩʔϧίϯςϯπ
ΠϯλʔϑΣʔεΛఆٛ͢Δ class ScrollableViewController: UIViewController { var scrollView: UIScrollView } class
ContainerViewController: UIViewController { var headerViewController: UIViewController // ϔομʔ var viewControllers: [ScrollableViewController] // εΫϩʔϧίϯςϯπ } εΫϩʔϧίϯςϯπScrollViewΛ͍ͬͯΔඞཁ͕͋Δ
ContainerViewControllerͷઃܭ • ΠϯλʔϑΣʔεΛఆٛ͢Δ • ChildViewControllerؒͷಠཱੑΛ୲อ͢Δ • ্࣮ͷ੍Λղܾ͢ΔɿࠓճScrollViewؔ࿈
ChildViewControllerͷ ಠཱੑΛ୲อ͢Δ • ཁ • ҙͷChildViewControllerΛѻ͍͍ͨ
class ScrollableViewController: UIViewController { var scrollView: UIScrollView } class ContainerViewController:
UIViewController { var headerViewController: UIViewController // ϔομʔ var viewControllers: [ScrollableViewController] // εΫϩʔϧίϯςϯπ } ChildViewControllerͷ ಠཱੑΛ୲อ͢Δ ѻ͑ΔChildViewControllerʹ੍ݶ͕͔͔͍ͬͯΔ
protocol Scrollable { var scrollView: UIScrollView! { get } }
class ContainerViewController: UIViewController { var headerViewController: UIViewController // ϔομʔ var viewControllers: [UIViewController & Scrollable] // εΫϩʔϧίϯςϯπ } ChildViewControllerͷ ಠཱੑΛ୲อ͢Δ ඞਢͷ੍protocolʹΓग़͢
ContainerViewControllerͷઃܭ • ΠϯλʔϑΣʔεΛఆٛ͢Δ • ChildViewControllerؒͷಠཱੑΛ୲อ͢Δ • ্࣮ͷ੍Λղܾ͢ΔɿࠓճScrollViewؔ࿈
• λϒͷίϯςϯπΛ εΫϩʔϧͰ͖Δ • ্·ͰεΫϩʔϧ͢Δͱ ࿈ଓతʹϔομʔ͕ॖΉ ScrollViewཁ݅
࣮Ҋ 1. ScrollViewΛೖΕࢠʹ͢Δ 2. εΫϩʔϧͰScrollView.frameΛߋ৽͢Δ 3. ScrollView.contentInsetΛར༻͢Δ
࣮Ҋ 1. ScrollViewΛೖΕࢠʹ͢Δ 2. εΫϩʔϧͰScrollView.frameΛߋ৽͢Δ 3. ScrollView.contentInsetΛར༻͢Δ
ScrollView.contentInsetΛ ར༻͢Δ
None
࣮
ScrollView.contentInsetΛར༻͢Δ ࣮ tabContentViewController.scrollView.contentInset.top = headerViewController.maximumHeight tabContentViewController.scrollView.observe(\.contentOffset) { (_, change) in
guard let offset = change.newValue else { return } self.headerHeightConstraint.constant = -(self.tabViewHeight + offset.y) } ContentOffsetͷมԽΛऔಘ͠ɺϔομʔߴ͞Λߋ৽
contentOffsetΛऔಘ͢ΔͳΒ scrollViewDidScroll Λ͑Α͍ͷͰ
ScrollViewDelegateΛ ར༻͠ͳ͍ཧ༝ • σϦήʔτʹઃఆͰ͖ΔΠϯελϯε ͻͱͭͳͷͰɺίϯςφଆͰར༻͢Δͱ ChildViewControllerͷσϦήʔτϝιου͕ ݺΕͳ͘ͳΔͨΊ
·ͱΊ • ΠϯλʔϑΣʔεΛઌʹߟ͑Δ • ChildViewControllerؒͷಠཱΛอͭʹ protocolΛ͏ • ScrollViewಛੑΛཧղͯ͠͏ • ChildViewControllerͷdelegateΛԣऔΓ͠ͳ͍
!WFTQJE HJUIVCDPNTQFFF4DSPMMBCMF5BC$POUSPMMFS ੍ͷͳ͔Ͱ ContainerViewControllerΛ ͭ͘Δํ๏
None
None
ิࢿྉ
ScrollView࣮ Ҋ
1. ScrollViewΛೖΕࢠʹ͢Δ
1. ScrollViewΛೖΕࢠʹ͢Δ ϔομʔ λϒ εΫϩʔϧίϯςϯπ
1. ScrollViewΛೖΕࢠʹ͢Δ • ࿈ଓͯ͠εΫϩʔϧ Ͱ͖ͳ͍
1. ScrollViewΛೖΕࢠʹ͢Δ આ໌ɿ • ͻͱͭͷScrollView͕εϫΠϓδΣενϟʔΛ ड͚औΔͱɺͦͷεΫϩʔϧ͕ऴΘΔ·Ͱ ଞͷScrollViewʹδΣενϟʔ͕·ΘΒͳ͍ͨΊ
2. εΫϩʔϧͰScrollView.frameΛ ߋ৽͢Δ
2. εΫϩʔϧͰScrollView.frameΛߋ৽͢Δ ϔομʔ λϒ εΫϩʔϧίϯςϯπ
2. εΫϩʔϧͰScrollView.frameΛߋ৽͢Δ • ʮϔομʔ͕ॖΉʯͷ͕ཁ݅ • ͦΕʮϔομʔҎ֎͕͕Δʯͱಉ͡ • εΫϩʔϧʹΑͬͯScrollView.frame.heightΛ มߋ͢Ε࣮ݱͰ͖ΔͷͰͳ͍͔ʁ
2. εΫϩʔϧͰScrollView.frameΛߋ৽͢Δ આ໌ɿ • εΫϩʔϧதʹScrollView.frame͕ߋ৽͞ΕΔͱ ʮϢʔβʔ͕৮͍ͬͯΔ(contentOffset)ʯ͕ มΘͬͯ͠·͏ • frameߋ৽ˠcontentOffsetߋ৽ˠframeߋ৽… ͷϧʔϓͰεΫϩʔϧ͕͓͔͘͠ͳΔ