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
Glance 3分クッキング
Search
ゆつぼ
December 06, 2024
0
79
Glance 3分クッキング
ゆつぼ
December 06, 2024
Tweet
Share
More Decks by ゆつぼ
See All by ゆつぼ
CredentialManager移行の落とし穴
morayl
0
510
安全にNavigateしよう
morayl
0
490
DAI語で行こう #as_tips / daigo_as_tips
morayl
1
460
Featured
See All Featured
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
We Have a Design System, Now What?
morganepeng
51
7.4k
It's Worth the Effort
3n
184
28k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Site-Speed That Sticks
csswizardry
4
380
Visualization
eitanlees
146
15k
Being A Developer After 40
akosma
89
590k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.8k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
133
33k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.4k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
240
Transcript
Glance 3分クッキング ゆつぼ(@morayl1)
ゆつぼ うつぼです。かわいい! 2 morayl morayl1 株式会社リクルート スタディサプリのAndroidエンジニア
Glanceと私 Glance = Compose を使用してアプリ ウィジェットを作成できるライブラリ。 2年半前(alpha03)に触って記事を書いた以来離れていた。 Glanceを使ってJetpackComposeでAndroidのウィジェットを開発しよう - Qiita
最近また触ったので、調べたことを共有する。 ※Glanceにフォーカスし、ウィジェットの基本は話しません 3
TodoListウィジェットを作ってみる 要件 • RoomのTodoListを表示 • スクロールできる • Todoをタップすると消せる 用意するものは3つ 1.
appwidget-provider(meta-data) 2. GlanceAppWidgetReceiver 3. GlanceAppWidget 4
依存関係 5
1. appwidget-provider(meta-data) AndroidManifestのGlanceAppWidgetReceiverのmeta-dataで参照する initialLoadingはglanceにデフォルトが 入っている Composeが表示されるまでに時間を 待つなら意味がある Flowで購読すればあまり意味はなさ そう 6
1. appwidget-provider(meta-data) AndroidManifestのGlanceAppWidgetReceiverのmeta-dataで参照する initialLoadingはglanceにデフォルトが 入っている Composeが表示されるまでに時間を 待つなら意味がある Flowで購読すればあまり意味はなさ そう •
xmlだが、Glanceライブラリにデフォルトが用意されている • 端末再起動時や、Glance準備中に表示されるレイアウト • もちろん自分で用意してもOK 7
2. GlanceAppWidgetReceiver これだけ! 8
3. GlanceAppWidget 最小構成 9
3. GlanceAppWidget 最小構成 見づらい 10
見た目を整える 11
見た目を整える material2 or 3のカラーを使うことが出来る 12
データを読み取る 13
データを読み取る • provideGlanceで時間のかかる処理を実行できる ◦ CoroutineWorkerとしてバックグラウンドで実行される ◦ 10分以内のタスクを実行できる(provideContentを呼ぶと45秒) ◦ ApiやDatastoreを使っても良い ◦
ここで時間がかかるとinitial_layoutが表示される • provideContent内でcollectAsStateでデータソースを監視する ◦ update/updateAllは、provideGlanceが実行中の場合それを再起動しない 14
リストを表示する 15
リストを表示する • LazyColumnで簡単に作れる • Glance ≒ Compose。割と使えるが、全て同じではない。 16
依存性注入 17
依存性注入 HiltのEntryPoinAccessorsを 使って簡単に注入できる 18
クリック処理 19
クリック処理 Activity起動はこれだけ repositoryへの入力もGlance内で解決できる 20
まとめ • レイアウトが≒Composeで書ける • 簡単にThemeを適用できる • provideGlance内でデータロード出来る • HiltのEntryPointAccessorsで依存性を注入できる •
クリック処理も簡単 Androidアドベントカレンダーで、詳細な記事を書きます! 21
参考(全てAndroid Developers) • Glance でアプリ ウィジェットを作成する ◦ まずはこれ • シンプルなウィジェットを作成する
◦ ウィジェットの基本(meta-dataとかも解説) • GlanceAppWidget provideGlance ◦ リファレンスに詳細な解説とサンプルコードが載っている • Create a widget with Glance | Android Developers ◦ GlanceのCodelab • Hilt でサポートされていないクラスに依存関係を注入する ◦ AppWidgetにRepositoryをInjectするときに使った方法 22