SwiftDataと連携したWidgetを作ってみた

mobile.stmn#10の登壇資料です

1. SwiftDataと連携したWidgetを 作ってみた iOSアプリ開発グループ 中山 龍 2025年2月28日 mobile.stmn #10
2. 自己紹介 中山 龍 (なかやま りゅう) • 株式会社kubell ◦ 新卒2年目のiOSエンジニア(22) ◦ 「Chatwork」アプリの開発を担当 • 愛知県在住 ◦ @ryu_develop mobile.stmnは#8まですべて登壇させて いただいていたが、#9が忘年会と被った ため皆勤賞が途絶えてしまいました
3. 注意事項 • 本スライドの内容や登場するコードは趣味で作成しているものであ り、業務で扱っているプログラム・プロダクト・開発環境とは一切 関係ありません • 「試しに触ってみた」という趣旨の紹介であり、必ずしもベストプ ラクティスを紹介しているわけではありません • スライド・GitHubに掲載しているコードも完璧な動作を保証するも のではありません
4. 目指す成果物
5. 最終的な成果物 5 • iOSのWidget • SwiftDataでアプリ本体とデータを共有することができる • WidgetのViewの中でSwiftDataを使うことができる アプリ本体 Widget
6. Widgetとは？
7. Widgetとは • ホーム画面やロック画面に配置することができるアプリの機能 • 最新の情報を一目で簡単に確認したり、アプリを開かずに操作することができる 7 Widgetを配置したホーム画面 Widget追加時の画面 参考: iPhoneでウィジェットを追加する/編集する/削除する
8. Widgetとは 〜ざっくり実装方法〜 1. iOSアプリを作成する 2. アプリにWidget Extensionを追加する 3. Widgetの見た目や処理を実装する(SwiftUI) 8 Widget Extensionを追加するときの画面
9. Widgetとは 〜ざっくり実装方法〜 1. iOSアプリを作成する 2. アプリにWidget Extensionを追加する 3. Widgetの見た目や処理を実装する(SwiftUI) 9 Widget Extensionを追加するときの画面 Widgetはアプリ本体ではなく、 Extensionの実装なので、通常のま まではアプリ本体の SwiftDataにはアクセスできない ↓
10. Widgetとは 〜ざっくり実装方法〜 1. iOSアプリを作成する 2. アプリにWidget Extensionを追加する 3. Widgetの見た目や処理を実装する(SwiftUI) 10 Widget Extensionを追加するときの画面 Widgetはアプリ本体ではなく、Extensionの実装なので、通常の ままではアプリ本体のSwiftDataにはアクセスできない ↓ WidgetからSwiftDataにアクセスできるようにし、アプリと データを共有したWidgetを作成する
11. Widget Extensionからアプリの SwiftDataにアクセスできるようにする
12. App Groupsの設定
13. App Groupsとは • 同じ開発者によって開発されたアプリ同士やExtension間でデータ共有を可能にする仕組 み • Capabilities(アプリが特定の機能やサービスにアクセスするための許可設定)の一種 • App Groupsを設定することで、アプリ本体とWidget Extension間でデータの共有が可能 になる 13
14. App Groupsを設定してみる(アプリ本体) Xcode上でxcodeprojファイル ↓ TARGETSでアプリ本体 ↓ Signing & Capabilities ↓ + Capability ↓ App Groupsを選択 14 1.アプリ本体に設定をする 追加された “App Groups” の欄で「+」を選択 ↓ ↓ 任意の名前を入力し「OK」を選択
15. App Groupsを設定してみる(Widget側) Xcode上でxcodeprojファイル ↓ TARGETSでWidget ↓ Signing & Capabilities ↓ + Capability ↓ App Groupsを選択 15 2.Widgetに設定をする 追加された “App Groups” の欄で「+」を選択 ↓ ↓ アプリ本体に設定したものと同じ名前を入力し 「OK」を選択
16. @ModelのTarget Membership設定
17. @ModelのTarget Membership設定 @Modelを定義しているファイルの Target Membership にWidgetExtensionを追加する - Target Membership: ファイルがどのターゲット(App, Extension ...)に属するかを決めるもの 17
18. 実際にWidget Extension内で SwiftDataを使う
19. Widget内でSwiftDataを使う 〜.modelContainer〜 19 Widgetのbody内のViewに対して .modelContainer を付与する - import SwiftData も忘れずにしましょう SwiftDataItemWidget.swift - SwiftDataItemWidget
20. Widget内でSwiftDataを使う 〜@Query〜 20 SwiftDataItemWidget.swift - SwiftDataItemWidgetEntryView 通常と同じようにView内で @Queryを使用して [Item] を取り出し、View内で利用する
21. Widget内でSwiftDataを使う 〜@Query〜 21 SwiftDataItemWidget.swift - SwiftDataItemWidgetEntryView 通常と同じようにView内で @Queryを使用して [Item] を取り出し、View内で利用する 🎉 Widget内でSwiftDataが使えるようになりました 🎉
22. 注意点
23. 注意点 23 Widget内でSwiftDataの値を使うことはできるようになりましたが、アプリ側で値を更新しても、それ に合わせてWidgetが更新されるわけではありません - SwiftDataの値は変わってもWidgetの表示の更新は起きていないため - WidgetCenter.shared.reloadAllTimelines() を使用することで、Widgetのタイムラインの再読込 を指示することができる - Widgetを更新することに関しては気にすべき点もあるので注意すること - ウィジェットを最新の状態に維持 - > ウィジェットを再読み込みすると、追加のネットワーク接続や処理が必要になるため、システムのリソース が消費され、バッテリーが消耗します。このようなパフォーマンスへの影響を軽減し、バッテリーの駆動時間 を一日中維持するには、リクエストする更新の頻度と回数を必要な分だけに制限します。 - > ユーザーが頻繁に確認するウィジェットの場合、通常、1日単位のバジェットに40〜70回の更新が 含まれます
24. 働くをもっと楽しく、創造的に 24