「JetpackComposeでのシンプルなアニメーション」をやりました！

はじめに

昨日に引き続き今日も公式チュートリアルをやったので、学んだことをアウトプットし覚えるために箇条書きで書こうと思います！
今日は「JetpackComposeでのシンプルなアニメーション」をやりました。普段の開発においてアニメーションを使ったことがなかったので、今後使っていけたらと思います。

学んだこと

・gradleにimplementation("androidx.compose.material:material-icons-extended")を追加すると、MaterialIconをローカルに持ってこなくても使用することが出来るようになる

・Iconの色を変えるときはtint

・大きさを変えるComposableのModifierにanimateContentSizeをつける

・大きさを変える際にはif文を使い、Trueのとき表示させるFalseのとき表示させないなどの方法がある

・animateContentSize内でanimationSpecを追加し、値を変えることでアニメーションをカスタマイズする

例)

modifier = Modifier
   .animateContentSize(
       animationSpec = spring(
           dampingRatio = Spring.DampingRatioNoBouncy,
           stiffness = Spring.StiffnessMedium
       )
   )

・1つの値をアニメーション化するにはanimate*AsState()が使える(*にはColorなどが入る)、targetValueをif文などを用いて切り替えることで切り替えを可能にする

例)

val color by animateColorAsState(
    targetValue = if (expanded) MaterialTheme.colorScheme.tertiaryContainer
    else MaterialTheme.colorScheme.primaryContainer,
)

最後に

今後も、このような形で学んだことをアウトプットしていこうと思います。次は、「演習：スーパーヒーローのアプリを作成する」をやる予定です。これは、演習なので学んだことをアウトプットする物というよりはどのようなことを意識してコードを書いたのかを記事に載せようと思います。これまでに学んだことを意識してコードを書こうと思います。