Wie animiere ich Änderungen der Schaltflächenbreite reibungslos, wenn in Jetpack Compose eine andere Schaltfläche ein-/a ⇐ Android

[Guest]

Ich möchte eine Animation erstellen, bei der es eine Schaltfläche gibt, die die gesamte Breite der Zeile einnimmt. Wenn eine zweite Schaltfläche erscheint (ihre Breite hängt vom Text ab), sollte die Breite der ersten Schaltfläche gleichmäßig abnehmen. Wenn die zweite Schaltfläche verschwindet, sollte sich die Breite der ersten Schaltfläche ebenfalls gleichmäßig vergrößern.
Ich habe versucht, diesen Effekt mithilfe von AnimatedVisibility zu implementieren. Allerdings funktioniert die Animation nicht wie erwartet. Die Breite der ersten Schaltfläche nimmt nicht allmählich ab, wenn die zweite Schaltfläche angezeigt wird. Stattdessen springt es abrupt ohne Animation. Das Gleiche passiert beim Ausblenden der zweiten Schaltfläche – die Breite der ersten Schaltfläche nimmt plötzlich zu.
Hier ist der Code, den ich ausprobiert habe:
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>
Ich erwarte, dass die Breite der ersten Taste mit der zweiten Taste reibungslos abnehmen sollte. In ähnlicher Weise sollte es reibungslos zunehmen, wenn die zweite Taste verschwindet. Mein Code "src =" https://i.static.net/iaxq26wk.gif "/>