Skip to main content

Jetpack ComposeのCodelab 10〜15章で学んだことを書く

Jetpack ComposeのCodelab 6〜9章で学んだことを書く
の続編

Jetpack ComposeのCodelabをやり始めたマスタカ
https://developer.android.com/courses/pathways/compose?hl=ja
毎日コツコツやって10章〜15章を読んだのでまとめ


基本形
・State
Stateの値を更新すると]etpackComposeが再ビルドされる

・MutableState
https://developer.android.com/jetpack/compose/state?hl=ja

・toggleable
Modifierに記載する
これで該当のチェックボックス以外を押しても反応するようになる

・@OptIn
Experiment系が使える

 

非同期系
・LaunchedEffect
コンポーザブルからsuspendを呼ぶ
https://developer.android.com/jetpack/compose/side-effects?hl=ja

・rememberUpdatedState
LaunchedEffectで再コンポーズ時に新しい関数を呼ぶ
https://zenn.dev/kaleidot725/articles/2022-02-14-jc-remember-updated-state

・rememberCoroutineScope
coroutineを参照するために使う
非corutineからcoroutineが呼べる
https://zenn.dev/kaleidot725/articles/2022-02-13-jc-remember-coroutine-scope

・produceState
FlowからStateへの変換
https://at-sushi.work/blog/48/

・collectAsState
FlowをState に変換して受け取る
https://qiita.com/Nabe1216/items/705460599db502882695

・snapshotFlow
StateをFlowへの変換
https://zenn.dev/kaleidot725/articles/2022-02-26-jc-snapshot-flow

・derivedStateOf
値が変化するときだけ動作する
https://developer.android.com/jetpack/compose/side-effects?hl=ja#derivedstateof

・DisposableEffect
diposeされたら処理を初期化する
https://developer.android.com/jetpack/compose/side-effects?hl=ja#disposableeffect

 

UI
・drawarc
Canvasに画面を書くために使う

・MutableInteractionSource
タップを追跡する
https://developer.android.com/jetpack/compose/handling-interaction?hl=ja

・Surface
Scaffoldの内部でSurfaceが使われている
https://zenn.dev/kgmyshin/articles/89ed1d35292093

・LazyListScope DSL
LazyListScope の DSL には、レイアウト内のアイテムを記述するためのさまざまな関数が用意されています。基本的には、item() では単一のアイテムを追加し、items(Int) では複数のアイテムを追加します。
https://developer.android.com/jetpack/compose/lists?hl=ja

 

Navigation
・composable()
NavHostのlambda内で表示する画面の定義するには、composableメソッドを使用します。
引数のrouteで、ルート名を定義します。このルート名を使用して画面遷移する先を決めます。
lambda内に表示する画面を定義します。
https://qiita.com/shxun6934/items/5301b69a85df98e30983#composable

・パラメーター渡したいとき

composable(route = "${SingleAccount.route}/{${SingleAccount.accountTypeArg}}",
                    arguments = listOf(
                        navArgument(SingleAccount.accountTypeArg) {
                            type = NavType.StringType
                        }
                    )
                ) {
                    SingleAccountScreen()
                }

 

テスト
・rule
以下で設定

@get:Rule
val composeTestRule = createComposeRule()

 

セマンティックス
・onNodeWithContentDescription
Finds a semantics node with the given contentDescription.

・useUnmergedTree
In order to verify whether the Text inside the tab is displayed or not, we can query the unmerged Semantics tree passing useUnmergedTree = true to the onRoot finder.

・semantics
意味推論用につけるらしい
.semantics { onClick(label = readArticleLabel, action = null) },

 

ラムダ
・ラムダの省略記法
これは
action = () -> Boolean
こう書ける
action = { openDialog = true; true}
「;」でreturnになるっぽい
これいつから使えるんだろ

 

Hilt
・DefaultDispatcher
https://stackoverflow.com/questions/70528059/where-is-the-defaultdispatche-instanced-by-hilt・HiltViewModel
https://tech.mokelab.com/android/compose/app/hilt/viewModel.html

・viewModel
viewModel()で初期化できる
https://tech.mokelab.com/android/compose/app/navigation/viewModel.html

 

これにて全部の学習完了しました
後は実践あるのみ

関連記事:

Pocket