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