JetpackCompose チュートリアル4
リストをアニメーションする
状態変数を定義(expanded)
状態による変化幅を定義(extraPadding)。ここでは高さを変える
アニメーションさせたい部分で上記で定義した変化幅を指定する
var expanded by remember { mutableStateOf(false) } val extraPadding by animateDpAsState( if (expanded) 48.dp else 0.dp ) …省略 Column(modifier = Modifier .weight(1f) .padding(bottom = extraPadding) ) { Text(text = "Hello, ") Text(text = name) }
既存styleから少しだけ変更したものを使いたい場合
copyを使って変更点だけ書き換える
Text( text = name, style = MaterialTheme.typography.headlineMedium.copy( fontWeight = FontWeight.ExtraBold ) )
アイコンボタン
開閉ボタンの例。
imageVectorにアイコンを指定する。
Iconsに開閉のアイコンも用意されている。
build.gradle(app)に以下を追加する必要がある。
implementation 'androidx.compose.material:material-icons-extended'
IconButton( onClick = { expanded = !expanded } ) { Icon( imageVector = if (expanded) Icons.Filled.ExpandLess else Icons.Filled.ExpandMore, contentDescription = if (expanded) { stringResource(id = R.string.show_less) } else { stringResource(id = R.string.show_more) } ) }