Skip to main content

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


Jetpack ComposeのCodelab1〜5章で学んだことを書
の続編

Jetpack ComposeのCodelabをやり始めたマスタカ
https://developer.android.com/courses/pathways/compose?hl=ja

毎日コツコツやって6章〜9章を読んだのでまとめ


・Modifier
・Modifier.heightIn(min: Dp, max: Dp)
コンテンツの高さを、受信測定の Constraints によって許容される min dp から max dp の範囲に制限します。
https://developer.android.com/jetpack/compose/modifiers-list?hl=ja

・Modifier.height(56.dp)
高さの設定

・horizontalArrangement
Columnでは横方向を指定するものとして利用する
以下で等間隔のスペースを空ける
horizontalArrangement = Arrangement.spacedBy(8.dp)

・contentPadding
コンテンツにpaddingをつける
contentPadding = PaddingValues(horizontal = 16.dp)

 

・UI
・スクロール
要素が無限ならlazyRow等を使う
要素が少なければRowに対してmodifierでverticalScrollやhorizontalScrollをつければよい
rememberScrollStateを渡す
こいつがスクロール位置等を持ってる

・Spannable
buildAnnotatedStringを使うとできる
http://y-anz-m.blogspot.com/2021/05/jetpack-compose-spannable.html

・shape
要素ごとに大きさが決まっていて
shapeを使うと該当の大きさの要素に対して一括でレイアウト更新をかけれる
https://developer.android.com/jetpack/compose/designsystems/material?hl=ja#shape

・painterResource
ベクター型の読み込みで使う
https://developer.android.com/jetpack/compose/resources?hl=ja

 

・バケツリレー回避
・CompositionLocalProvider
オブジェクトを渡す
https://qiita.com/ticktakclock/items/dbbc543a97cd6f1ca52e

・ProvideTextStyle
スタイルを渡す
https://at-sushi.work/blog/51/

 

・アニメーション
https://qiita.com/yuta0124/items/02f63b02957af7da07eb

・animateColorAsState
色の変更等のアニメーションを簡単に実施できる
https://zenn.dev/tbsten/articles/c8019c78645c81
・AnimatedVisibility
visible-goneでアニメーションを実施する
https://zenn.dev/kaleidot725/articles/f66551da64669b
・animateContentSize
コンテンツのサイズでアニメーションする
・Transition
複数をアニメーションする場合に利用する
updateTransitionで設定する
isTransitioningToでアニメーションの条件を指定できる

 

・ジェスチャー
https://developer.android.com/jetpack/compose/animation?hl=ja
・splineBasedDecay
// Used to calculate a settling position of a fling animation.
・pointerInput
タップインベント
・AwaitPointerEventScope
Receiver scope for awaiting pointer events in a call to PointerInputScope.awaitPointerEventScope.
・awaitFirstDown
Reads events until the first down is received in the given
https://developer.android.com/reference/kotlin/androidx/compose/ui/input/pointer/AwaitPointerEventScope
・VelocityTracker
速度を測る
・horizontalDrag
Reads horizontal position change events for pointerId and calls onDrag for every change in position
・snapTo
Animatable は、コンテンツ値に対する他のオペレーション(snapTo と animateDecay)を提供します。snapTo は、現在の値を直ちにターゲット値に設定します。これは、アニメーション自体が唯一の信頼できる情報源ではなく、タップイベントなどの他の状態と同期する必要がある場合に便利です
・animateTo
Starts an animation to animate from value to the provided targetValue. If there is already an animation in-flight, this method will cancel the ongoing animation before starting a new animation continuing the current value and
animateDecay:指定された速度より遅くなるアニメーションを開始します

 

こうして6章~9章をやりましたとさ
まだまだ続くよ

関連記事:

Pocket