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
Xcode 16のPreviewModifierと@Previewableを活用した効率的なプ...
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
ojun
July 05, 2024
Programming
1.1k
4
Share
Xcode 16のPreviewModifierと@Previewableを活用した効率的なプレビュー方法の考察
ojun
July 05, 2024
More Decks by ojun
See All by ojun
配列と所有権
ojun9
0
60
生成 AI 時代のスナップショットテストってやつを見せてあげますよ(α版)
ojun9
0
380
アセットのコンパイルについて
ojun9
0
240
Exit 8 for SwiftUI
ojun9
1
290
Swift Evolution かるた
ojun9
2
140
Catch Up with Swift 5.10
ojun9
2
910
Overview: Swift OpenAPI Generator
ojun9
3
2.6k
if 式と switch 式による SwiftUI のプレビューエラー対策
ojun9
1
2.2k
楽しい夏休み!String Catalogs で新しい発見
ojun9
0
2.5k
Other Decks in Programming
See All in Programming
タクシーアプリ『GO』の バックエンド開発のおける AI利活用と若者のすべて
pyama86
3
1.9k
「エンジニアインターン、どうやって取った?」準備のリアルを語るLT会 Progate BAR
akiomatic
0
120
不変条件と整合性境界—ビジネスが決める設計判断と実現パターン / Invariants and Consistency Boundaries
nrslib
13
3.4k
TAKTでAI駆動開発の品質を設計する
j5ik2o
6
890
AIとASP.NET Coreで雑Webアプリを作った話
mayuki
0
310
Javaの型とAI時代に型が大事な理由 / java types and type in AI era
kishida
2
100
セキュリティの専門家じゃなくてもできる。「セキュリティ意識」をアップデートして サプライチェーン攻撃への耐性を高めよう。
tk3fftk
5
630
Why Laravel apps break—Mastering the fundamentals to keep them maintainable
kentaroutakeda
1
340
Technical Debt: Understanding it Rightly, Engaging it Rightly #LaravelLiveJP
shogogg
0
190
開発体験を左右するライブラリの API 設計 - GraphQL スキーマ構築ライブラリから考える #tskaigi
izumin5210
2
1.6k
Oxcを導入して開発体験が向上した話
yug1224
4
280
関係性から理解する"同一性"の型用語たち
pvcresin
2
640
Featured
See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
23k
We Are The Robots
honzajavorek
0
240
How to train your dragon (web standard)
notwaldorf
97
6.7k
Deep Space Network (abreviated)
tonyrice
0
160
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
28
3.5k
The Curious Case for Waylosing
cassininazir
1
370
Joys of Absence: A Defence of Solitary Play
codingconduct
1
390
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
310
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
830
A Modern Web Designer's Workflow
chriscoyier
698
190k
Building Flexible Design Systems
yeseniaperezcruz
330
40k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
Transcript
potatotips #88 iOS/Android։ൃTipsڞ༗ձ 2024/07/05 @STORES Xcode 16ͷPreviewModifierͱ@Previewable Λ׆༻ͨ͠ޮతͳϓϨϏϡʔํ๏ͷߟ ojun -
DeNA Co., Ltd.
ࣗݾհʢojunʣ • name: ojun • 2023৽ଔೖࣾ • iOSΤϯδχΞ @ojun_9
Xcode 16ͷ PreviewModifier ͱ @Previewable Λ׆༻ͨ͠ޮతͳϓϨϏϡʔํ๏ͷߟ
PreviewModifier ͱ ˏPreviewable ʹ͍ͭͯ
@Previewable ʹ͍ͭͯ @Previewable Xcode 16 ͰՃ͞ΕͨϚΫϩ ϓϩύςΟʔϥούʔʹରͯ͠దԠ͢Δ͜ͱ͕Ͱ͖Δ #Previewͷ෦Ͱ༻Մೳ iOS
ʹؔͯ͠ iOS 18 Ҏ্Ͱಈ࡞͢Δ
None
PreviewModifierʹ͍ͭͯ PreviewModi fi er Xcode 16 ͰՃ͞Εͨprotocol iOS ʹؔͯ͠
iOS 18 Ҏ্Ͱಈ࡞͢Δ
None
None
None
None
None
None
None
None
Context Context
Context Context View
Context Context View
Context Context View
None
͜ͷ2ͭͷػೳΛݟͨ࣌ʹͲ͏ࢥ͍·ͨ͠ ͔ʁ
͜ͷ2ͭͷػೳΛݟͨ࣌ʹͲ͏ࢥ͍·͔ͨ͠ʁ ݸਓతʹ͜ΕΒͷػೳΛ࠷ॳʹݟͨ࣌ʮѻ͏ͷ͕େͦ͠͏ʯͱࢥͬͨ
͜ͷ2ͭͷػೳΛݟͨ࣌ʹͲ͏ࢥ͍·͔ͨ͠ʁ ݸਓతʹ͜ΕΒͷػೳΛ࠷ॳʹݟͨ࣌ʮѻ͏ͷ͕େͦ͠͏ʯͱࢥͬͨ
͜ͷ2ͭͷػೳΛݟͨ࣌ʹͲ͏ࢥ͍·͔ͨ͠ʁ ݸਓతʹ͜ΕΒͷػೳΛ࠷ॳʹݟͨ࣌ʮѻ͏ͷ͕େͦ͠͏ʯͱࢥͬͨ
͜ͷ2ͭͷػೳΛݟͨ࣌ʹͲ͏ࢥ͍·͔ͨ͠ʁ makeSharedContext() ͷ͍ํ͕؊ʹͳΔ mockαʔόͱ௨৴͢Δʁ → PreviewͰͦ͜·Ͱ͢Δͷ͔ʁ ݸਓతʹ͜ΕΒͷػೳΛ࠷ॳʹݟͨ࣌ʮѻ͏ͷ͕େͦ͠͏ʯͱࢥͬͨ
PreviewModifier ͱ @PreviewableΛ׆ ༻ͨ͠ޮతͳϓϨϏϡʔํ๏ͷߟ
લఏͱͳΔViewͷ࡞ SNSͷλΠϜϥΠϯΛߟ͑Δ
લఏͱͳΔViewͷ࡞ SNSͷλΠϜϥΠϯΛߟ͑Δ ߘΛද͢ߏମΛఆٛ
લఏͱͳΔViewͷ࡞ SNSͷλΠϜϥΠϯΛߟ͑Δ ViewΛఆٛ [Post] Λ࣋ͪ body Ͱར༻
લఏͱͳΔViewͷ࡞
લఏͱͳΔViewͷ࡞
લఏͱͳΔViewͷ࡞ PreviewͰͬͱද͍ࣔͤͨ͞ʂ
લఏͱͳΔViewͷ࡞
લఏͱͳΔViewͷ࡞
લఏͱͳΔViewͷ࡞
લఏͱͳΔViewͷ࡞ ಡΈࠐΈ࣌ͷ Placeholder େৎ͔ͳʁ ໊લ͘ͳͬͨ࣌େৎ͔ͳʁ վߦ͞ΕͨΒେৎ͔ͳʁӳޠɾֆจࣈͷ࣌ େৎ͔ͳ ͍͍Ͷͷ͕ଟ͍࣌େৎ͔ͳ 0݅ͷ࣌ඇදࣔʹͳΔ͔ͳʁ
લఏͱͳΔViewͷ࡞ ඞཁͳύλʔϯͷ Post ΛՃ͢Ε ෳύλʔϯͷ Preview Մೳ ͔͠͠ӈਤͷΑ͏ʹ͔ͳΓݟͮΒ͘ͳΔ
લఏͱͳΔViewͷ࡞ ඞཁͳύλʔϯͷ Post ΛՃ͢Ε ෳύλʔϯͷ Preview Մೳ ͔͠͠ӈਤͷΑ͏ʹ͔ͳΓݟͮΒ͘ͳΔ @Previewable
PreviewModi fi er Λར༻͠ ղܾ͢Δ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ 1. JSONϑΝΠϧΛ࡞͠ɺඞཁͳσʔλΛՃ͢Δ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ 1. JSONϑΝΠϧΛ࡞͠ɺඞཁͳσʔλΛՃ͢Δ 1. ʢࠓճ ChatGPT Λར༻ͯ͠࡞ʣ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ 1. JSONϑΝΠϧΛ࡞͠ɺඞཁͳσʔλΛՃ͢Δ 1. ʢࠓճ ChatGPT Λར༻ͯ͠࡞ʣ
2. ʢ࡞͠Ճ͢Δ͚ͩͳͷͰׂѪʣ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ 1. JSONϑΝΠϧΛ࡞͠ɺඞཁͳσʔλΛՃ͢Δ 1. ʢࠓճ ChatGPT Λར༻ͯ͠࡞ʣ
2. ʢ࡞͠Ճ͢Δ͚ͩͳͷͰׂѪʣ 2. JSONϑΝΠϧΛಡΈࠐΈ decode ͠ Preview ʹೖ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ let posts: [Post] ͕ @Environment Ͱͳ͍߹
@Previewable Λར༻͢Δͱྑͦ͞͏
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ .task {} ͘͠ .onAppear {} Λ
ར༻ͦ͠ͷதͰಡΈࠐΈΛߦ͏
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ .task {} ͘͠ .onAppear {} Λ
ར༻ͦ͠ͷதͰಡΈࠐΈΛߦ͏ decode ͕ޭͨ͠Βɺposts ʹೖ ͢Δ
.task {} ͘͠ .onAppear {} Λ ར༻ͦ͠ͷதͰಡΈࠐΈΛߦ͏ decode ͕ޭͨ͠Βɺposts ʹೖ
͢Δ ෳͷύλʔϯͰ Preview ͕Մೳʹͳͬͨ 🎉
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ let posts: [Post] ͕ @Environment Ͱ͋Δ߹
PreviewModi fi er Λར༻͢Δͱྑͦ͞͏
@Previewable PreviewModifier Λར༻͠ղܾ͢Δ
None
None
·ͱΊ
·ͱΊ Xcode 16͔ΒPreviewModi fi er ͱ @Previewable ͕Ճ͞Εͨ ͜ΕΒΛར༻͢Δ͜ͱͰ Preview
ͷମݧ͕ΑΓ্͢Δ JSONϑΝΠϧΛར༻͠ΤϯςΟςΟΛೖ͢Δ͜ͱͰগ͠ͷίʔυͰଟྔͷύλʔϯΛ Preview Ͱ֬ೝ͢Δ͜ͱ͕Մೳ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ