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
220
日本だけで解禁されているアプリ起動の方法
ryunakayama
0
420
iOSアプリでフロントエンドと仲良くする
ryunakayama
0
150
「ジェン文字」使ってますか?
ryunakayama
0
77
Health Kit × Foundation Models でAIコーチを作ってみた
ryunakayama
0
360
iOSの画面の状態のアレコレを調査してみた
ryunakayama
0
100
作文ツール(Writing Tools)をアプリから制御する
ryunakayama
0
61
iOSアプリで測る!名古屋駅までの 方向と距離
ryunakayama
0
310
「ジェン文字」をアプリ内で使ってみよう
ryunakayama
0
200
Other Decks in Programming
See All in Programming
Contextとはなにか
chiroruxx
1
390
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
4
1.6k
Javaの型とAI時代に型が大事な理由 / java types and type in AI era
kishida
2
160
LaravelLive Japan の裏方のすべて — 第188回 PHP勉強会@東京 (2026-06-24)
suguruooki
2
140
TSKaigi Night Talks 2026_TypeScriptでサプライチェーンの整合性を型に閉じ込める
geekplus_tech
0
420
ECSアプリログをFireLensでコスト削減しようとしたけど諦めた話 in Fargate×Node.js
akihisaikeda
2
4.2k
TAKTでAI駆動開発の品質を設計する
j5ik2o
7
1.6k
OS アップデート対応の取り組み方がもっと共有されてほしい
andpad
0
110
どこまでゆるくて許されるのか
tk3fftk
0
300
The ROI of Quarkus for Spring Boot Applications
hollycummins
0
150
Performance Engineering for Everyone
elenatanasoiu
0
250
TypeScript+Orvalで実現する型安全かつ堅牢でスケーラブルなマルチチャネル通知基盤 / TSKaigi Night talks ~after conference~
d0riven
0
380
Featured
See All Featured
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
240
Technical Leadership for Architectural Decision Making
baasie
3
430
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
220
A Modern Web Designer's Workflow
chriscoyier
698
190k
The Spectacular Lies of Maps
axbom
PRO
1
840
ラッコキーワード サービス紹介資料
rakko
1
3.8M
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
190
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
400
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
380
4 Signs Your Business is Dying
shpigford
187
22k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.9k
Docker and Python
trallard
47
3.9k
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