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
Composeのライフサイクル対応を支援するLifecycleEventEffectの紹介
Search
mikan
August 10, 2023
Technology
1
870
Composeのライフサイクル対応を支援するLifecycleEventEffectの紹介
YUMEMI.grow Mobile #6 での発表資料です
https://www.youtube.com/watch?v=gNd-3YjaUwg
mikan
August 10, 2023
Tweet
Share
More Decks by mikan
See All by mikan
Navigation3でViewModelにデータを渡す方法
mikanichinose
0
330
「脳に収まるコードの書き方」を読んで学んだこと
mikanichinose
1
120
RepositoryのSSoT化
mikanichinose
0
49
Kotlin Multiplatform 始めました
mikanichinose
1
130
Web APIをなぜつくるのか
mikanichinose
0
2.5k
イベントをどう管理するか
mikanichinose
3
360
ライブラリでしかお目にかかれない珍しい実装
mikanichinose
2
450
Strong Skipping Mode によってrecompositionはどう変わったのか
mikanichinose
0
330
Modeling UiEvent
mikanichinose
0
85
Other Decks in Technology
See All in Technology
データアナリストからアナリティクスエンジニアになった話
hiyokko_data
2
440
AI時代に非連続な成長を実現するエンジニアリング戦略
sansantech
PRO
3
1.2k
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
3
1.4k
BPaaSにおける人と協働する前提のAIエージェント-AWS登壇資料
kentarofujii
0
130
大「個人開発サービス」時代に僕たちはどう生きるか
sotarok
20
9.5k
5年目から始める Vue3 サイト改善 #frontendo
tacck
PRO
3
200
複数サービスを支えるマルチテナント型Batch MLプラットフォーム
lycorptech_jp
PRO
0
270
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
8.7k
Rustから学ぶ 非同期処理の仕組み
skanehira
1
120
企業の生成AIガバナンスにおけるエージェントとセキュリティ
lycorptech_jp
PRO
2
140
20250903_1つのAWSアカウントに複数システムがある環境におけるアクセス制御をABACで実現.pdf
yhana
3
530
サンドボックス技術でAI利活用を促進する
koh_naga
0
200
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
How GitHub (no longer) Works
holman
315
140k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
51
5.6k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
Optimizing for Happiness
mojombo
379
70k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
RailsConf 2023
tenderlove
30
1.2k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Building Adaptive Systems
keathley
43
2.7k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
Compose のライフサイクル対応 を支援する LifecycleEventEffect の紹介 YUMEMI.grow Mobile #6 一瀬喜弘(@mikanIchinose)
自己紹介 object Mikan { val name = " 一瀬喜弘" val
company = "karabiner.tech" val hobby = listOf( " 漫画", " アニメ", " ゲーム", " 折り紙", "OSS 開発・コントリビュート", ) }
目次 LifecycleEventEffect なる副作用が入ることを知る 追加されたAPI の紹介 Compose の中でLifecycle-aware な何かを扱う場合のTips まとめ
LifecycleEventEffect なる副作用が入ることを知る
alpha リリースに入った!!
これまでのライフサイクル対応 DisposbleEffect とLifecycleEventObserver を利用する val lifecycle = LocalLifecycleOwner.current.lifecycle DisposableEffect(lifecycle) {
val lifecycleObserver = LifecycleEventObserver { _, event -> if (event == Lifecycle.Event.ON_RESUME) { // do something } } lifecycle.addObserver(lifecycleObserver) onDispose { lifecycle.removeObserver(lifecycleObserver) } }
LifecycleEventEffect 1 つのライフサイクルイベントにたいして処理をフックできる @Composable fun LifecycleEventEffect( event: Lifecycle.Event, lifecycleOwner: LifecycleOwner
= LocalLifecycleOwner.current, onEvent: () -> Unit )
LifecycleEventEffect 使い方 LifecycleEventEffect(Lifecycle.Event.ON_START) { // do something onStart } //
イベントトラッキング LifecycleEventEffect(Lifecycle.Event.ON_RESUME) { logger.trackScreenView(screen_name) } // データ更新 // 後述するLifecycle-aware なViewModel を紐付ける実装のほうがオススメ LifecycleEventEffect(Lifecycle.Event.ON_RESUME) { viewModel.fetchData() }
LifecycleStartEffect ON_START, ON_STOP 時に処理をフックする @Composable fun LifecycleStartEffect( vararg keys: Any?,
lifecycleOwner: LifecycleOwner = LocalLifecycleOwner.current, effects: LifecycleStartStopEffectScope.() -> LifecycleStopOrDisposeEffectResult )
LifecycleStartEffect 使い方 onStopOrDispose :onStop とonDispose のときに処理を実行する LifecycleStartEffect { // ON_START
で実行したい処理 onStopOrDispose { // ON_STOP で実行したい処理 } } ` `
LifecycleStartEffect 使い方 @Composable fun Counter() { var count by remember
{ mutableStateOf(0) } LaunchedEffect(count) { delay(1000) count++ } LifecycleStartEffect(count) { Log.d("Counter", "onStart") onStopOrDispose { Log.d("Counter", "onStop or onDispose") } } Text(text = "$count") }
LifecycleResumeEffect ON_RESUME, ON_PAUSE 時に処理をフックする @Composable fun LifecycleResumeEffect( vararg keys: Any?,
lifecycleOwner: LifecycleOwner = LocalLifecycleOwner.current, effects: LifecycleResumePauseEffectScope.() -> LifecyclePauseOrDisposeEffectResult )
Lifecycle.currentStateFlow Lifecycle.currentStateAsState Lifecycle.eventFlow open val currentStateFlow: StateFlow<Lifecycle.State> @Composable fun Lifecycle.currentStateAsState():
State<Lifecycle.State> // lifecycle.currentStateFlow.collectAsState() のショートハンド val Lifecycle.eventFlow: Flow<Lifecycle.Event>
Tips: Lifecycle-aware な ViewModel を Compose に紐付 ける ライフサイクルを紐付けるだけで関数呼び出しを書かなくてよいのでタイミングを間違えることがない class
MainViewModel : ViewModel(), DefaultLifecycleObserver { override fun onResume(owner: LifecycleOwner) { // fetch data // track event // ... } } val lifecycle = LocalLifecycleOwner.current.lifecycle DisposableEffect(lifecycle) { lifecycle.addObserver(viewModel) onDispose { lifecycle.removeObserver(viewModel) } }
Tips: Lifecycle-aware な ViewModel を Compose に紐付 ける class MainViewModel
: ViewModel(), DefaultLifecycleObserver { override fun onResume(owner: LifecycleOwner) { // fetch data // track event // ... } } @Composable fun LifecycleObserver.observeLifecycleEvents(lifecycle: Lifecycle = LocalLifecycleOwner.current.lifecycle) { DisposableEffect(lifecycle) { lifecycle.addObserver(this@observeLifecycleEvents) onDispose { lifecycle.removeObserver(this@observeLifecycleEvents) } } }
Tips: Lifecycle-aware な ViewModel を Compose に紐付 ける class MainViewModel
: ViewModel(), DefaultLifecycleObserver { override fun onResume(owner: LifecycleOwner) { // fetch data // track event // ... } } @Composable fun LifecycleObserver.observeLifecycleEvents(lifecycle: Lifecycle = LocalLifecycleOwner.current.lifecycle) { DisposableEffect(lifecycle) { lifecycle.addObserver(this@observeLifecycleEvents) onDispose { lifecycle.removeObserver(this@observeLifecycleEvents) } } } @Composable fun GreetingScreen(viewModel: MainViewModel) { viewModel.observeLifecycleEvents() // ... }
まとめ Lifecycle.{Event, State} をcoroutine やcompose で利用するための拡張が入った Lifecycle を扱う系の副作用が3 つ入った 従来のDisposableEffect
を使ったボイラープレートを減らせそう( な気がする) LifecycleResumeEffect 、LifecycleStartEffect の実用的な使い方ワカラン