Масштабирование анимации кнопок в Jetpack Compose ⇐ Android

[Anonymous]

Я хочу создать эту потрясающую анимацию нажатия кнопки в приложении AirBnB с помощью Jetpack Compose

< /p>
К сожалению, API анимации/переходов недавно был изменен, и документации по нему почти нет. Может ли кто-нибудь помочь мне найти правильный подход к реализации этой анимации нажатия кнопки?
Изменить
Основываясь на ответе @Amirhosein, я разработал кнопку, которая выглядит почти так же, как в примере с Airbnb
Код:

Код: Выделить всё

@Composable
fun AnimatedButton() {
val boxHeight = animatedFloat(initVal = 50f)
val relBoxWidth = animatedFloat(initVal = 1.0f)
val fontSize = animatedFloat(initVal = 16f)

fun animateDimensions() {
boxHeight.animateTo(45f)
relBoxWidth.animateTo(0.95f)
// fontSize.animateTo(14f)
}

fun reverseAnimation() {
boxHeight.animateTo(50f)
relBoxWidth.animateTo(1.0f)
//fontSize.animateTo(16f)
}

Box(
modifier = Modifier
.height(boxHeight.value.dp)
.fillMaxWidth(fraction = relBoxWidth.value)

.clip(RoundedCornerShape(8.dp))
.background(Color.Black)
.clickable { }
.pressIndicatorGestureFilter(
onStart = {
animateDimensions()
},
onStop = {
reverseAnimation()
},
onCancel = {
reverseAnimation()
}
),
contentAlignment = Alignment.Center
) {
Text(text = "Explore Airbnb", fontSize = fontSize.value.sp, color = Color.White)
}
}

Видео:


К сожалению, я не могу понять, как правильно анимировать текст, так как сейчас он выглядит очень плохо

Подробнее здесь: https://stackoverflow.com/questions/662 ... ck-compose