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
SwiftDataと連携したWidgetを作ってみた
Search
Ryu-nakayama
February 28, 2025
Programming
220
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
SwiftDataと連携したWidgetを作ってみた
mobile.stmn#10の登壇資料です
Ryu-nakayama
February 28, 2025
More Decks by Ryu-nakayama
See All by Ryu-nakayama
iOS機能開発のAI環境と起きた変化
ryunakayama
0
210
日本だけで解禁されているアプリ起動の方法
ryunakayama
0
420
iOSアプリでフロントエンドと仲良くする
ryunakayama
0
150
「ジェン文字」使ってますか?
ryunakayama
0
74
Health Kit × Foundation Models でAIコーチを作ってみた
ryunakayama
0
350
iOSの画面の状態のアレコレを調査してみた
ryunakayama
0
95
作文ツール(Writing Tools)をアプリから制御する
ryunakayama
0
59
iOSアプリで測る!名古屋駅までの 方向と距離
ryunakayama
0
310
「ジェン文字」をアプリ内で使ってみよう
ryunakayama
0
200
Other Decks in Programming
See All in Programming
ふつうのFeature Flag実践入門
irof
8
4.1k
TypeScript+Orvalで実現する型安全かつ堅牢でスケーラブルなマルチチャネル通知基盤 / TSKaigi Night talks ~after conference~
d0riven
0
360
さぁV100、メモリをお食べ・・・
nilpe
0
150
Mujeres en SEO Summit 2026 - Greatest Disaster Hits en Web Performance
guaca
0
190
Vite+ Unified Toolchain for the Web
naokihaba
0
330
AIで効率化できた業務・日常
ochtum
0
140
正しくソフトウェアを作る、前提を疑うための認知の視点 / doubt-premise
minodriven
21
7k
Even G2とAWSで推しのエージェントを召喚しよう!
har1101
1
120
そのテスト、説明できますか?~LWテスト戦略FW~のご紹介
nakahara
0
160
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
mom0tomo
8
3.3k
AIだと陥りがちなJakarta EE最新技術への移行時の落とし穴と解決策
tnagao7
0
120
エージェンティックRAGにAWSで入門しよう!
har1101
9
1.7k
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
RailsConf 2023
tenderlove
30
1.5k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
23k
Mobile First: as difficult as doing things right
swwweet
225
10k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
440
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
320
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
How to make the Groovebox
asonas
2
2.2k
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
210
First, design no harm
axbom
PRO
2
1.2k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
490
Transcript
SwiftDataと連携したWidgetを 作ってみた iOSアプリ開発グループ 中山 龍 2025年2月28日 mobile.stmn #10
自己紹介 中山 龍 (なかやま りゅう) • 株式会社kubell ◦ 新卒2年目のiOSエンジニア(22) ◦
「Chatwork」アプリの開発を担当 • 愛知県在住 ◦ @ryu_develop mobile.stmnは#8まですべて登壇させて いただいていたが、#9が忘年会と被った ため皆勤賞が途絶えてしまいました
注意事項 • 本スライドの内容や登場するコードは趣味で作成しているものであ り、業務で扱っているプログラム・プロダクト・開発環境とは一切 関係ありません • 「試しに触ってみた」という趣旨の紹介であり、必ずしもベストプ ラクティスを紹介しているわけではありません • スライド・GitHubに掲載しているコードも完璧な動作を保証するも
のではありません
目指す成果物
最終的な成果物 5 • iOSのWidget • SwiftDataでアプリ本体とデータを共有することができる • WidgetのViewの中でSwiftDataを使うことができる アプリ本体 Widget
Widgetとは?
Widgetとは • ホーム画面やロック画面に配置することができるアプリの機能 • 最新の情報を一目で簡単に確認したり、アプリを開かずに操作することができる 7 Widgetを配置したホーム画面 Widget追加時の画面 参考: iPhoneでウィジェットを追加する/編集する/削除する
Widgetとは 〜ざっくり実装方法〜 1. iOSアプリを作成する 2. アプリにWidget Extensionを追加する 3. Widgetの見た目や処理を実装する(SwiftUI) 8
Widget Extensionを追加するときの画面
Widgetとは 〜ざっくり実装方法〜 1. iOSアプリを作成する 2. アプリにWidget Extensionを追加する 3. Widgetの見た目や処理を実装する(SwiftUI) 9
Widget Extensionを追加するときの画面 Widgetはアプリ本体ではなく、 Extensionの実装なので、通常のま まではアプリ本体の SwiftDataにはアクセスできない ↓
Widgetとは 〜ざっくり実装方法〜 1. iOSアプリを作成する 2. アプリにWidget Extensionを追加する 3. Widgetの見た目や処理を実装する(SwiftUI) 10
Widget Extensionを追加するときの画面 Widgetはアプリ本体ではなく、Extensionの実装なので、通常の ままではアプリ本体のSwiftDataにはアクセスできない ↓ WidgetからSwiftDataにアクセスできるようにし、アプリと データを共有したWidgetを作成する
Widget Extensionからアプリの SwiftDataにアクセスできるようにする
App Groupsの設定
App Groupsとは • 同じ開発者によって開発されたアプリ同士やExtension間でデータ共有を可能にする仕組 み • Capabilities(アプリが特定の機能やサービスにアクセスするための許可設定)の一種 • App Groupsを設定することで、アプリ本体とWidget
Extension間でデータの共有が可能 になる 13
App Groupsを設定してみる(アプリ本体) Xcode上でxcodeprojファイル ↓ TARGETSでアプリ本体 ↓ Signing & Capabilities ↓
+ Capability ↓ App Groupsを選択 14 1.アプリ本体に設定をする 追加された “App Groups” の欄で「+」を選択 ↓ ↓ 任意の名前を入力し「OK」を選択
App Groupsを設定してみる(Widget側) Xcode上でxcodeprojファイル ↓ TARGETSでWidget ↓ Signing & Capabilities ↓
+ Capability ↓ App Groupsを選択 15 2.Widgetに設定をする 追加された “App Groups” の欄で「+」を選択 ↓ ↓ アプリ本体に設定したものと同じ名前を入力し 「OK」を選択
@ModelのTarget Membership設定
@ModelのTarget Membership設定 @Modelを定義しているファイルの Target Membership にWidgetExtensionを追加する - Target Membership: ファイルがどのターゲット(App,
Extension ...)に属するかを決めるもの 17
実際にWidget Extension内で SwiftDataを使う
Widget内でSwiftDataを使う 〜.modelContainer〜 19 Widgetのbody内のViewに対して .modelContainer を付与する - import SwiftData も忘れずにしましょう
SwiftDataItemWidget.swift - SwiftDataItemWidget
Widget内でSwiftDataを使う 〜@Query〜 20 SwiftDataItemWidget.swift - SwiftDataItemWidgetEntryView 通常と同じようにView内で @Queryを使用して [Item] を取り出し、View内で利用する
Widget内でSwiftDataを使う 〜@Query〜 21 SwiftDataItemWidget.swift - SwiftDataItemWidgetEntryView 通常と同じようにView内で @Queryを使用して [Item] を取り出し、View内で利用する
🎉 Widget内でSwiftDataが使えるようになりました 🎉
注意点
注意点 23 Widget内でSwiftDataの値を使うことはできるようになりましたが、アプリ側で値を更新しても、それ に合わせてWidgetが更新されるわけではありません - SwiftDataの値は変わってもWidgetの表示の更新は起きていないため - WidgetCenter.shared.reloadAllTimelines() を使用することで、Widgetのタイムラインの再読込 を指示することができる
- Widgetを更新することに関しては気にすべき点もあるので注意すること - ウィジェットを最新の状態に維持 - > ウィジェットを再読み込みすると、追加のネットワーク接続や処理が必要になるため、システムのリソース が消費され、バッテリーが消耗します。このようなパフォーマンスへの影響を軽減し、バッテリーの駆動時間 を一日中維持するには、リクエストする更新の頻度と回数を必要な分だけに制限します。 - > ユーザーが頻繁に確認するウィジェットの場合、通常、1日単位のバジェットに40〜70回の更新が 含まれます
働くをもっと楽しく、創造的に 24