Как оживить ширину кнопки плавно меняется при показе/скрытии другой кнопки в JetPack Compose? ⇐ Android

[Anonymous]

Я хочу создать анимацию, где есть кнопка, которая занимает полную ширину ряда. Когда появляется вторая кнопка (его ширина зависит от его текста), ширина первой кнопки должна быть плавно уменьшаться. Точно так же, когда вторая кнопка исчезает, ширина первой кнопки должна увеличиваться плавно. Тем не менее, анимация не работает, как ожидалось. Ширина первой кнопки не постепенно уменьшается, когда появляется вторая кнопка; Вместо этого он резко прыгает без какой -либо анимации. То же самое происходит при скрытии второй кнопки - ширина первой кнопки внезапно увеличивается. < /P>
Вот код, который я пробовал: < /p>
var show by remember { mutableStateOf(false) }

Column(
modifier = Modifier.fillMaxSize().padding(16.dp),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {

Button(onClick = { show = !show}){
Text(text = "Click")
}

Spacer(modifier = Modifier.padding(32.dp))

Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
AnimatedVisibility(
visible = show,
exit = fadeOut() + slideOutHorizontally(),
enter = fadeIn() + slideInHorizontally()
) {
OutlinedButton(
onClick = {}
){
Text("Button 2")
}
}

Button(
modifier = Modifier.fillMaxWidth(),
onClick = {}
){
Text("Button 1", modifier = Modifier.animateContentSize())
}
}
}
< /code>
Я и ожидаю, что ширина первой кнопки должна быть плавно уменьшаться, когда появляется вторая кнопка. Точно так же, он должен увеличиться плавно, когда вторая кнопка исчезает.>

Подробнее здесь: https://stackoverflow.com/questions/793 ... her-button